HTML & CSS

text-shadow와 text-stroke

breeghty 2022. 11. 21. 19:08

https://stackoverflow.com/questions/2570972/css-font-border

 

CSS Font Border?

With all the new CSS3 border stuff going on (-webkit, ...) is it now possible to add a border to your font? (Like the solid white border around the blue Twitter logo). If not, are there any not-too...

stackoverflow.com

hover시 text-stroke를 적용한 결과

text-shadow는 텍스트에 그림자효과를 주는 속성이다. text-stroke는 text에 border를 주는 속성이다. 

 

text-stroke 속성의 경우 모든 브라우저에서 적용되는 속성은 아니므로 -webkit-와 같은 벤더 프리픽스를 붙여 주어야 한다.

 

참고:

https://gurtn.tistory.com/139

 

[CSS] text에 테두리(border) 넣기

아래의 HTML 코드를 기준으로 CSS를 이용한 텍스트에 외곽선 효과를 주는 방법을 소개하겠습니다. Text Border Test -webikit-text-stroke h2 { -webkit-text-stroke: 2px red; } 해당 방법은 표준적인 방법이 아니기에

gurtn.tistory.com