티스토리 소제목 스타일 편집 양식을 공유합니다.

티스토리 블로그를 운영하면서, 소제목 서식(HTML)을 활용하는 것은 문서의 가독성을 높이고, 문서 클릭율 등을 높이는데 매우 유용합니다. 티스토리 소제목 서식을 활용하여, 블로그 포스팅 하는 노하우와 쉽게 활용할 수 있는 스킨 양식을 공유합니다.

 

티스토리 소제목 스타일 모음집.txt

0.00MB

---

1. h2 스타일 소제목

적용해야 하는 HTML 양식
<h2 style="box-sizing: border-box; border-right-width: 0px; border-bottom: #0000FF 1px solid; margin: 5px 0px; 
border-left: #0000FF 10px solid; letter-spacing: 1px; line-height: 1.5; border-top-width: 0px; padding: 3px 5px 3px 5px;" data-ke-size="size26"><b>h2 스타일 소제목</b></h2>

✓ 색상 및 굵기 변경 설명에 대한 해설(이하 동일)

border-bottom: #0000FF = 밑줄 색상 border-bottom: #0000FF 1px solid = 1px 밑줄 굵기 border-left: #0000FF = 좌측 네모바 색상 border-left: #0000FF 15px solid = 15px 좌측바 굵기

 

✓ 스타일 색상변경

스타일 색상변경은 #(4자리숫자)영문2자리 로 구성되는데요, 세부적인 색상표를 확인하고 싶으신 분은 아래 사이트로 바로 가시면 됩니다.

 

HTML 색상표 바로가기

 

2. h3 스타일 소제목

적용해야 하는 HTML 양식
<h3 style="padding: 0.4em 1em 0.4em 0.5em; background: #e9efed; margin: 0.5em 0em; color: #000000; border-left: #00a667 10px solid; font-weight: bold;" data-ke-size="size23">h3 스타일 소제목</h3><p data-ke-ze="size16"></p>

 

 

반응형

 

3. h3 스타일 소제목

적용해야 하는 HTML 양식
<h3 style="padding: 0.4em 1em 0.4em 0.5em; margin: 0.5em 0em; color: #000000; border-style: dashed; border-width: 1px, 1px, 1px, 1px; border-color: #A9A9F5; background-color: #dce5fb; font-weight: bold;" data-ke-size="size23">h3 스타일 소제목</h3> <p data-ke-size="size16"></p>

 

4. h3 스타일 소제목

적용해야 하는 HTML 양식
<h3 style="background: #25abe5; color: #ffffff; font-weight: bold; margin: 1em 0em; padding: 15px 20px; border-radius: 25px 25px 25px 0px;" data-ke-size="size23">h3 스타일 소제목</h3> <p data-ke-size="size16"></p>

 

5. 깔끔한 인덱스

적용해야 하는 HTML 양식
<h3 data-ke-size="size23"><span style="border-radius: 15px 15px 0 0; border-bottom: 5px solid #B2E0F7; padding: 0.5em 1em; background: #D8EFFB; font-weight: bold;">깔끔한 인덱스</span></h3> <p data-ke-size="size16"></p>