Notice
Recent Posts
Recent Comments
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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
- 개미수열
- 클래스레벨밸리데이션
- i18n
- LastModified
- Kotlin
- 지수반등
- 스프링
- 리얼월드HTTP
- 알게뭐냐
- 알고리즘
- 코드스피츠
- kotliln
- 지뢰찾기
- HTTP
- 워드프레스
- 브로틀리
- etag
- jsr303
- cross parameter
- brotli
- 랜선아미안해
- 이렇게살아야되나자괴감이
- cache-control
- jsr380
- Spring
Archives
- Today
- Total
취미개발 블로그와 마음수양
구글 웹폰트 깨지는 현상 고치기 본문
구글 웹폰트 깨지는 현상 고치기~
/* This is the default font face used for all browsers. */
@font-face {
font-family: 'chunk-webfont';
src: url('../../includes/fonts/chunk-webfont.eot');
src: url('../../includes/fonts/chunk-webfont.eot?#iefix') format('eot'),
url('../../includes/fonts/chunk-webfont.woff') format('woff'),
url('../../includes/fonts/chunk-webfont.ttf') format('truetype'),
url('../../includes/fonts/chunk-webfont.svg') format('svg');
font-weight: normal;
font-style: normal;
}
/* This font face inherits and overrides the previous font face, but only for chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
@font-face {
font-family: 'chunk-webfont';
src: url('../../includes/fonts/chunk-webfont.svg') format('svg');
}
두번째 방법
I've written a big answer on that issue here: Is there any “font smoothing” in Google Chrome?. The post contains everything you need to know and how to fix this. And this is an official bug in Google Chrome, the developers of the browser already know about it and are working on a fix.
In short, you can add this to your text rule to make the fonts look much better:
text-stroke-fix:
-webkit-text-stroke: 1px
or
-webkit-text-stroke: 1px rgba(0,0,0,0.1)
text-shadow-trick:
text-shadow: #fff 0px 1px 1px;
or
text-shadow: #333 0px 0px 1px; // for black text
font-smoothing-trick (in combination with the above):
-webkit-font-smoothing: antialiased;
Note: These are workarounds, not a real fix of the basic problem
---------------
주소 :
http://stackoverflow.com/questions/17867574/chrome-not-antialiasing-text
'FrontEnd > HTML5 _CSS' 카테고리의 다른 글
float로 튀어나온 레이아웃 잡기 (0) | 2014.07.01 |
---|---|
그래프 표현해보기 (0) | 2014.06.30 |
이미지 가운데에 넣기~ vertical image (0) | 2014.06.25 |
테이블 Td 감싸기..싸이즈 딱 맞게. (0) | 2014.06.11 |
show(), display (css) 차이. ㅋ (0) | 2014.06.04 |