[Spring Boot] 12. 웹페이지 디자인(CSS)

스태틱 디렉터리와 스타일시트

스타일시트, 즉 css파일은 static 디렉터리에 저장해야 한다.

\

CSS 파일 만들기

static 폴더 우클릭 후 [New -> File] 클릭

style.css

textarea {
	width:100%;
}

input[type=submit]{
	margin-top:10px;
}

 

템플릿에 스타일 적용

이전에 만든 html에 위의 style.css를 적용해보자.

question_detail.html

<link rel="stylesheet" type="text/css" th:href="@{/style.css}">

<h1 th:text="${question.subject}">제목</h1>
<div th:text="${question.content}">내용</div>

<h5 th:text="|${#lists.size(question.answerList)}개의 답변이 있습니다.|"></h5>
<div>
	<ul>
		<li th:each="answer : ${question.answerList}" th:text="${answer.content}"></li>
	</ul>
</div>


<form th:action="@{|/answer/create/${question.id}|}" method="post">
	<textarea name="content" id="content" rows="15"></textarea>
	<input type="submit" value="답변 등록">
</form>

 

적용된 결과