언더라인 밑줄 형광팬 효과 <<
요즘 티스토리에서 기본적으로 제공하는 스킨에서 여러 CSS 소스를 파헤쳐가며 조금씩 변화를 주고 있어요. 물론 전문분야는 아니라서 여러 지식을 습득하며 해보고 있지만, 그중에서 밑줄에 형광팬 효과 만드는 방법을 소개해볼께요.
일단은 설정에서 스킨편집!
저는 기본적으로 오디세이 스킨을 쓰고 있어요.
[여기에서 HTML 편집]
[최하단에 요 문구만 삽입해 주면 됩니다.]
}
u {
text-decoration: none;
display: inline;
box-shadow: inset 0 -10px 0 hsla(165, 60%, 83%, 0.5);
}
컬러를 바꾸는 방법은 hsla(165, 60%, 83%, 0.5) 이 부분을 바꾸는 건데요. hsla는 hue(색상), satuation(채도), lightness(밝기), alpha 값을 바꾸어주면 되는데, 색상은 0-360 / 채도는 0-100 / 알파는 0.0~1.0(0은 완전투명, 1은 불투명)
https://www.google.com/search?q=rgb+to+hex&oq=rgb+to+hex
rgb to hex - Google 검색
Enter a Color: name, hex, rgb, hsl, hwb, cmyk, ncol: Name, DeepSkyBlue. Rgb, rgb(0, 191, 255). Hex, #00bfff. Hsl, hsl(195, 100%, 50%). Hwb, hwb(195, 0%, 0%).
www.google.com
색상은 위에 링크를 타고 가시면 쉽게 HSL 로 만들 수 있어요.
저는 대충 잡았는데, 해당 코드 색상은 이렇네요
실제적으로 본문에서 글 작성시에는 위에 그림 처럼 밑줄로 보이지만, 글 작성 완료하고 보면 제대로 효과가 적용되어 보여요! 그럼 이만!
'일상의 취미' 카테고리의 다른 글
| 칼칼한 국물, 술안주로는 역시 국물이죠. 황소곱창전골 밀키트 (0) | 2021.09.20 |
|---|---|
| 맛도 비쥬얼도 훌륭한 콘치즈바비큐 치킨, 밀키트 추천! (3) | 2021.08.27 |
| 치질인가? 하아... ... 기나긴 고민으로 2주가 흘렀었다. (0) | 2021.08.09 |
| 원조춘천닭갈비, 집에서 즐기는 춘천! 애슐리 홈스토랑 밀키트! (0) | 2021.08.05 |
| 크림새우그라탕! CJ 쿡킷 밀키트로 만나보아요! (0) | 2021.08.05 |