728x90

 

문의사항 수정 게시판 만들기

boardQnaUpdateForm.html

 

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title> TREND_EATER </title>

<!-- UIkit CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/uikit@3.14.3/dist/css/uikit.min.css" />

<!-- UIkit JS -->
<script src="https://cdn.jsdelivr.net/npm/uikit@3.14.3/dist/js/uikit.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/uikit@3.14.3/dist/js/uikit-icons.min.js"></script>

<link rel="stylesheet" type="text/css" href="boardWriteForm.css">

</head>
<body>

<div class="head">
    <h2>1:1 문의</h2>
</div>

<div class="main">
    
    <div class="QuesType">
        <div class="uk-form-select innerQuesType" data-uk-form-select>
            <div class="innerQuesTypeLeft">
                <span>유형</span>
            </div>
            <div class="innerQuesTypeRight">
                <select>
                    <option value="1" name="1">주문/결제/반품/교환문의</option>
                    <option value="2">이벤트/쿠폰/적립금문의</option>
                    <option value="3">상품문의</option>
                    <option value="4">배송문의</option>
                    <option value="5">상품 누락 문의</option>
                    <option value="6" name="6">기타문의</option>
                </select>
                <c:if test="${ name eq 1 }">
                    <select>
                        <option value="">주문취소 해주세요</option>
                        <option value="">상품 반품을 원해요</option>
                        <option value="">상품 교환을 원해요</option>
                        <option value="">주문/결제는 어떻게 하나요?</option>
                        <option value="">오류로 주문/결제가 안 돼요</option>
                        <option value="">기타</option>
                    </select>
                </c:if>
            </div>             
        </div>
    </div>
    <div class="QuesProduct">

    </div>
    <div class="QuesTitle">
        <span>제목</span>
        <input class="uk-input" value="${ b.qnaTitle }">
    </div>
    <div class="QuesContent">
        <span>내용</span>
        <textarea class="uk-textarea">${b.qnaContent}</textarea>

        
    </div>


    <div class="submitButton">
        <button onclick="location.href='boardQna.bo?page'">수정 완료</button>
        <button onclick="location.href='boardQna.bo?page'">목록으로</button> <!-- 3번페이지면 3번으로 돌아갈 수 있게 page-->
    </div>

</div>


</body>
</html>

 

CSS

@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css); 



body{
    font-family: "Noto Sans";
}

h2{
    border-bottom: 2px solid black;
    padding: 2%;
}
span{
    width:100px;
    padding-right: 30px;
    margin: 0 auto;
    text-align: center;
}



.head{
    width:1000px;
    align-items: center;
    margin-left: 10px;
    margin: 0 auto;
    
}

.main{
    max-width: 1000px;
    display: flex;
    flex-direction: column;
    margin: 0 auto;

}
.QuesType{
    display: flex;
    padding:1% 0;
}
.innerQuesType{
    display: flex;  
}
.innerQuesTypeLeft{
    width:100px;
    text-align: center;
    padding: 0 13px;
}

.QuesTitle{
    display: flex;
    padding:1% 0;
}
.QuesTitle > input{
    width:890px;
}

.QuesContent{
    display: flex;
    height:500px;
    padding:1% 0;
    word-break: normal;
}
.QuesContent > textarea{
    width:890px;
    padding:1% 0;
}


.submitButton{
    width:1000px;
    text-align: center;
    margin:2% auto;
    padding-right: 3%;
    
}
.submitButton > button{
    width:150px;
    height:35px;
    background-color: #FE8F8F;
    border: 1px solid #FF5C58;
    color:#fff;
}

/**********
1.보드라이트폼 전체 가운데 정렬
2.유형,제목,내용 정렬


********/

 

728x90
반응형
저작자표시

'small steps > 1일 1코딩 - 코딩을 내 몸처럼' 카테고리의 다른 글

[1일 1코딩][Web-Java] QnA 수정,삭제  (0) 2022.07.01
[1일 1코딩][Web-Java] QnA 조회(+페이징처리), 쓰기  (0) 2022.06.30
[1일 1코딩][Web] 게시물 등록했는데 db에 (null)값 들어오는 이유  (0) 2022.06.28
[1일 1코딩][Web-Java] 문의사항 게시판 전체 리스트 조회 & 백단 서버 연결 - 중점적으로 봐야할 코드 부분 체크  (0) 2022.06.27
[1일 1코딩][HTML-CSS] QnA 글쓰기 폼  (0) 2022.06.26

+ Recent posts

티스토리툴바