<body>
<!-- th:fragment="이름" 으로 공통 태그부분 작성 -->
<div
th:fragment="formErrors"
class="alert alert-danger"
role="alert"
th:if="${#fields.hasAnyErrors()}"
>
<div th:each="err : ${#fields.allErrors()}" th:text="${err}" />
</div>
</body>
question_form.html, question_detail.html 에 에러 폼 변경
<div th:replace="layout::formErrors"></div>
테스트해보기
네비게이션 모듈화
<nav
th:fragment="nav"
class="navbar navbar-expand-md navbar-light bg-light border-bottom"
>
<div class="container-fluid">
<a class="navbar-brand" href="/">SBB</a>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link" href="#">로그인</a>
</li>
</ul>
</div>
</div>
</nav>
모든 페이지에 추가
<nav th:replace="layout::nav"></nav>
하지만 화면이 작아졌을 때 오른쪽 위 토글 버튼이 눌러지지 않음 -> js가 없어서 그럼
아까 다운로드 받은 부트스트랩 폴더에서
해당 파일을 넣어줌
head에 추가
<!-- Bootstrap JS -->
<script th:src="@{/bootstrap.bundle.min.js}"></script>
테스트하기 - 토글 버튼 누르면 내려오는지
'BACKEND > SpringBoot' 카테고리의 다른 글
| 게시물에 일련번호 추가하기 (0) | 2023.11.09 |
|---|---|
| 페이징 (0) | 2023.11.09 |
| 답변(Answer) 유효성 검사 추가 (0) | 2023.11.09 |
| 질문 등록 처리 및 유효성검사 (5) | 2023.11.09 |
| 부분 모듈화 ( th:fragment / th:replace ) (0) | 2023.11.09 |