Open kyupid opened 2 years ago
// 타임리프 레이아웃 implementation group: 'nz.net.ultraq.thymeleaf', name: 'thymeleaf-layout-dialect', version: '3.0.0'
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"> <head th:fragment="configFragment"> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>테스트</title> <meta name="description" content=""> <meta property="og:site_name" content=""> <meta name="keywords" content=" "> <meta property="og:image" content=""> <!-- css --> <link rel="stylesheet" th:href="@{css/style.css}"> <!-- js --> <script th:src="@{js/jquery-1.12.4.min.js}"></script> <script th:src="@{js/front_ui.js}"></script> <script th:src="@{js/ui.js}"></script> <script th:src="@{js/swiper.min.js}"></script> <script th:src="@{js/template.js}"></script> <!-- 각 컨텐츠페이지의 스크립트 영역이 들어감 --> <!-- <th:block layout:fragment="script"></th:block>--> </head> </html>
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"> <head th:replace="layout/config :: configFragment"></head> <body> <div layout:fragment="content"></div> <!-- header나 footer도 th:replace 방식으로 하면됨--> </body> </html>
<!DOCTYPE html> <html lang="ko" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" layout:decorate="layout/layout" > <!-- index.html 고유 CSS 추가 --> <!--<th:block layout:fragment="css">--> <!-- <style>--> <!-- .testDiv{--> <!-- height: 500px;--> <!-- background-color: gold;--> <!-- }--> <!-- </style>--> <!--</th:block>--> <!-- index.html 고유 스크립트 추가 --> <!--<th:block layout:fragment="script"> </th:block>--> <div layout:fragment="content"> <!-- <body> 태그대신에 위 div 로 감싸면됨 --> </div> <!--// layout fragment--> <script> $('.btn-state').on('click', function(){ $(this).toggleClass('on') }) </script> </html>
config.html
layout.html
페이지들.html