테두리

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

Text Border Test 위의 HTML 코드를 기준으로 CSS를 이용한 텍스트에 외곽선 효과를 주는 방법을 소개하겠습니다. -webikit-text-stroke h2 { -webkit-text-stroke: 2px red; } 해당 방법은 표준적인 방법이 아니기에 지원하지 않는 브라우저가 존재할 수 있습니다. 하지만 text-stroke라는 속성을 이용해 단순한 width, color 지정으로 테두리를 넣을 수 있습니다. text-stroke는 width가 커질수록 바깥쪽으로 두꺼워지는 것이 아니기에 특정 수치에서는 글자를 먹어버립니다. text-shadow h2 { text-shadow: -1px 0 red, 0 1px red, 1px 0 red, 0 -1px red; } 해당 방법은 text-s..