티스토리 소제목 꾸미기 그라데이션 적용 박스 예제 HTML 서식

---

 

티스토리에서 소제목 서식으로 활용하면 블로그글의 가독성을 높일수 있습니다. 소제목 꾸미기는 방법은 두가지 방법이 있는데 서식을 활용한 방법이 편하고 사용하기 좋습니다. 여러 예시를 서식에 넣어두고 가독성 있는 글을 만드시길 바랍니다.

티스토리 소제목 꾸미는법 적용방법은? (참고)

티스토리 소제목 꾸미는법 서식 활용하기

 

 

그라데이션 소제목 스타일 예시

 

노란색 그라데이션

 

<h3 style="background: linear-gradient(220.55deg, #FFF500 0%, #FFA500 100%); color: #000; font-weight: bold; margin: 0.5em 0em; padding: 15px 20px; border-radius: 20px 20px 20px 00px;" data-ke-size="size23">제목</h3>

 

 

---

 

 

파란색 그라데이션

 

<h3 style="background: linear-gradient(220.55deg, #00C6FF 0%, #0072FF 100%); color: #fff; font-weight: bold; margin: 0.5em 0em; padding: 15px 20px; border-radius: 20px 20px 20px 00px;" data-ke-size="size23">제목</h3>

 

 

---

 

초록색 그라데이션

<h3 style="background: linear-gradient(220.55deg, #00FF87 0%, #008F4C 100%); color: #fff; font-weight: bold; margin: 0.5em 0em; padding: 15px 20px; border-radius: 20px 20px 20px 00px;" data-ke-size="size23">제목</h3>

 

---

 

핑크색 그라데이션

<h3 style="background: linear-gradient(220.55deg, #FF69B4 0%, #FF1493 100%); color: #fff; font-weight: bold; margin: 0.5em 0em; padding: 15px 20px; border-radius: 20px 20px 20px 00px;" data-ke-size="size23">핑크색 그라데이션</h3>

 

---

회색그라데이션

<h3 style="background: linear-gradient(to right, #4c5664 0%, #c4c7cd 100%); color: #fff; font-weight: bold; margin: 0.5em 0em; padding: 15px 20px; border-radius: 0px 20px 20px 20px;" data-ke-size="size26">회색그라데이션</h3>

 

---

 

태그 설명

 

background	linear-gradient(220.55deg, #FF69B4 0%, #FF1493 100%)	핑크색 그라데이션 배경
color	#fff	글자색
font-weight	bold	굵은 글씨체
margin	0.5em 0em	위아래 0.5em, 좌우 0em 여백
padding	15px 20px	내부 여백 상하 15px, 좌우 20px
border-radius	20px 20px 20px 00px	좌상단, 우상단, 우하단 20px, 좌하단 0px 둥글기
data-ke-size	size23	티스토리 에디터 글자 크기 설정

 

 

 

소제목 그라데이션 꾸미기 사용하시고 블로그 이쁘게 꾸미시길 바랍니다 활용을 잘하셨다면 좋아요 버튼과 댓글 주시면 감사하겠습니다.❤