본문 바로가기
티스토리컴파스/◾소제목꾸미기

티스토리 꾸미기 소제목 스타일 서식 활용하기 그라데이션 색상

by 잇츠팁 2024. 12. 7.

 



서식을 이용한 소제목 꾸미기 하는법 바로가기

 

 

 

다양한 코드를 활용해서 서식 스타일을 만들고 소제목을 꾸미면 글의 가독성을 높일수 있습니다.

서식을 이용하는 방법은 쉽게 할수 있으니 코드를 복사하셔서 서식을 이용해서 소제목을 이쁘게 

꾸미시길 바랍니다.

 

 

 

 

소제목 스타일

<div style="padding: 0px 0px 3px 10px; margin: 0.5em 0em; background: linear-gradient(0deg, #F7D456 32%, #6FE0F2 100%);">
<h3 style="padding: 10px 15px; margin: 0em 0em; background-color: #ffffff; font-weight: bold; color: #000;" data-ke-size="size23"> 소제목 스타일 </h3>
</div>

 

 

 



소제목 스타일

 

<div style="padding: 0px 0px 3px 10px; margin: 0.5em 0em; background: linear-gradient(0deg, #F7D456 32%, #F23710 100%);">
<h3 style="padding: 10px 15px; margin: 0em 0em; background-color: #ffffff; font-weight: bold; color: #000;" data-ke-size="size23">소제목 스타일</h3>
</div>

 

 



소제목 스타일

 

<div style="padding: 0px 0px 3px 10px; margin: 0.5em 0em; background: linear-gradient(0deg, #36B1F7 32%, #F23710 100%);">
<h3 style="padding: 10px 15px; margin: 0em 0em; background-color: #ffffff; font-weight: bold; color: #000;" data-ke-size="size23">소제목 스타일</h3>
</div>

 

 

소제목 스타일

<div style="padding: 0px 0px 3px 10px; margin: 0.5em 0em; background: linear-gradient(0deg, #103545 32%, #F2F0EF 100%);">
<h3 style="padding: 10px 15px; margin: 0em 0em; background-color: #ffffff; font-weight: bold; color: #000;" data-ke-size="size23">소제목 스타일</h3>
</div>

 

 

소제목 스타일

<div style="padding: 0px 0px 3px 10px; margin: 0.5em 0em; background: linear-gradient(0deg, #F36AEA 33%, #F2F0EF 100%);">
<h3 style="padding: 10px 15px; margin: 0em 0em; background-color: #ffffff; font-weight: bold; color: #000;" data-ke-size="size23">소제목 스타일</h3>
</div>

 


소제목으로 많이 사용하는 예시의 스타일 입니다. 색상은 그라데이션 색상으로 변경해 보았습니다. 복사하셔서 서식으로 활용하시길 바랍니다.