일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 | 31 |
Tags
- #happycgi
- 홈페이지
- #cgimall
- 해피씨지아이
- #이미지
- #해피CGI
- #뉴스
- #업종별
- #동영상
- 사이트제작
- 웹솔루션
- #쇼핑몰
- 해피CGI
- #솔루션
- #image
- #jQuery
- CGIMALL
- CSS
- #CSS
- jquery
- javascript
- #홈페이지
- 쇼핑몰
- php
- 게시판
- #홈페이지제작
- #웹솔루션
- happycgi
- 솔루션
- 홈페이지제작
- Today
- Total
웹솔루션개발 22년 노하우! 해피CGI의 모든것
[해피CGI][cgimall] CSS로 안티앨리어싱 효과 내기 (폰트를 부드럽게) 본문
기본 폰트가 아닌 웹폰트를 사용하다가 보면 같은 소스와 폰트인데도 불구하고
브라우저마다의 랜더링 차이로 글자가 다르게 보일때가 종종
있습니다.
일반인들은 잘 눈치채기 어렵지만, 웹디자이너들의 눈에는 금방 확인이 되는 부분이죠.
-webkit-font-smoothing:
antialiased;
-moz-osx-font-smoothing: grayscale;
이럴때를 대비하여 폰트 안티앨리어싱을 적용할 수 있습니다.
참고로
표준코드는 아니지만, CSS 트릭을 사용하여 포토샵과 같은 부드러운 폰트의
느낌을 나타낼 수 있습니다.
-webkit-text-stroke: 0.45px;
//
or
-webkit-text-stroke: 0.45px rgba(0, 0, 0, 0.1);
// or
text-shadow:
#fff 0px 1px 1px;
위에 적힌 영문사이트에서는 SVG 폰트를 사용하면
양쪽해결이 되긴 하지만
역시나 무거워지므로 크게 권하진 않는듯 합니다.
'웹프로그램밍 자료실 > 기타 자료' 카테고리의 다른 글
[해피CGI][cgimall] 마우스 오버 효과로 컨텐츠에 집중을 도와주자 (0) | 2018.09.11 |
---|---|
[해피CGI][cgimall] 해외 CSS Reset 사이트 (0) | 2018.09.05 |
[해피CGI][cgimall] 업로드한 이미지를 링크만으로 공유하는 img64 (1) | 2018.08.29 |
[해피CGI][cgimall] 슬라이드 화살표 스타일 (0) | 2018.08.28 |
[해피CGI][cgimall] Hover.css (0) | 2018.08.23 |
Comments