티스토리 본문 글씨 밑줄 형광펜 효과주기

티스토리에서 글 작성 시, 강조하고 싶은 단어나 문장에 밑줄을 긋거나 배경색을 이용하는데, 간단하게 CSS 코드를 입력해서 밑줄에 형광펜(색상) 효과 주는 방법을 알아봅니다. 

 

 

1. 밑줄 형광펜 효과 넣기

1) 티스토리 관리 → 스킨 편집 → html 편집으로 이동. 

2) CSS 가장 하단에 다음의 코드를 입력합니다. ▼

u { 
text-decoration: none; 
display: inline; 
box-shadow: inset 0 -10px 0 hsla(53, 89%, 50%, 0.53);
}

그림1. 티스토리 CSS 코드 입력하기

 

 

3) hsla(53, 89%, 50%, 0.53)는 색상을 나타내는 부분으로, 원하는 색상으로 변경 가능합니다. ▼

마우스를 움직여서 원하는 색상을 선택.

 

그림2. 색상 변경하기

 

 

2. CSS u코드 삽입으로 달라진 밑줄 확인

적용 전, 후 본문 글씨 밑줄 비교 이미지입니다. ▼

그림3. u코드 적용 전,후 비교 사진 화면

 

글자배경색을 바꾸는 것과는 다른 느낌! 

 

 

 

대표 썸네일 사진