๐โ๏ธ QNA ์๋น์ค ๊ธฐ๋ฅ ๊ตฌํ (๋ณต์ต) _ 100๊ฐ ~ 113๊ฐ
1๏ธโฃ CSS, ๋ถํธ์คํธ๋ฉ, ํฐํธ
โ bootstrap ๋ค์ด๋ก๋ ์์ด cdn ์ผ๋ก ๋์ (https://cdnjs.com/)
- ์ ์ฉ์ํฌ html ํ์ผ์ ์ถ๊ฐ
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.2.2/css/bootstrap.min.css">โก ํฐํธ ์ ์ฉ (https://noonnu.cc/font_page/366)
- ์ ์ฉ์ํฌ css ํ์ผ์ ์ถ๊ฐ
/*์นํฐํธ ๊ฐ์ง๊ณ ์ด*/
@font-face {
font-family: 'GmarketSansMedium';
src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
font-weight: normal;
font-style: normal;
}
// (์๋ต)
html > body {
font-family: "GmarketSansMedium";
}2๏ธโฃ layout ์ ์ฉ
โ ์์กด์ฑ ์ถ๊ฐ (https://mvnrepository.com/artifact/nz.net.ultraq.thymeleaf/thymeleaf-layout-dialect/3.1.0)
implementation 'nz.net.ultraq.thymeleaf:thymeleaf-layout-dialect:3.1.0'
โก layout.html ์์ฑ
<!doctype html>
<html lang="ko">
<head>
<!-- head ๋ด์ฉ ์๋ต -->
</head>
<body>
<header>
<!-- header ๋ด์ฉ ์๋ต -->
</header>
<!-- ๊ธฐ๋ณธ ํ
ํ๋ฆฟ ์์ ์ฝ์
๋ ๋ด์ฉ Start -->
<th:block layout:fragment="content"></th:block>
<!-- ๊ธฐ๋ณธ ํ
ํ๋ฆฟ ์์ ์ฝ์
๋ ๋ด์ฉ End -->
<footer>
<!-- footer ๋ด์ฉ ์๋ต -->
</footer>
</body>
</html>โข layout ์ ์ฉ
<html layout:decorate="~{layout}">
<div layout:fragment="content" class="container my-3">
<!-- (์๋ต) -->
</div>
</html>
'TIL ๐' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
| TIL 9์ผ์ฐจ (2022.10.19) (0) | 2022.10.19 |
|---|---|
| TIL 8์ผ์ฐจ (2022.10.18) (0) | 2022.10.18 |
| TlL 6์ผ์ฐจ (2022.10.14) (0) | 2022.10.14 |
| TIL 5์ผ์ฐจ (2022.10.13) (0) | 2022.10.13 |
| TIL 4์ผ์ฐจ (2022.10.12) (0) | 2022.10.12 |
