CSS 글꼴 테두리 추가 하는 방법

질문 : CSS 글꼴 테두리?

---

모든 새로운 CSS3 테두리 항목 ( -webkit , ...)이 진행되면서 글꼴에 테두리를 추가 할 수 있습니까? (파란색 트위터 로고 주위의 단색 흰색 테두리처럼). 그렇지 않다면 CSS / XHTML에서이 작업을 수행 할 너무 못생긴 해킹이 있습니까? 아니면 여전히 Photoshop을 실행해야합니까?

답변

---

-webkit 접두사 뒤에 일부 브라우저 에서 지원되는 text-stroke 라는 실험적 CSS 속성이 있습니다.

 

h1 {
    -webkit-text-stroke: 2px black; /* width and color */

    font-family: sans; color: yellow;
}

<h1>Hello World</h1>

 

text-shadow 속성을 사용하여 모든 방향에 1 픽셀 씩 4 개의 그림자를 사용하는 것입니다.

h1 {
    /* 1 pixel black shadow to left, top, right and bottom */
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;

    font-family: sans; color: yellow;
}

<h1>Hello World</h1>

그러나 픽셀 두께가 1 픽셀 이상이면 흐려집니다.

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