Bạn sẽ phải tự lưu trữ phông chữ nếu bạn muốn áp dụng sửa lỗi này.
Liên kết Google Fonts của bạn là một yêu cầu cho biểu định kiểu được tạo động dựa trên các thông số bạn cung cấp - và trên phát hiện trình duyệt. Ví dụ liên kết của bạn:
<link href='http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
Nếu bạn thực sự thực hiện yêu cầu mình sử dụng curl
:
$ curl http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic
đây là những gì được gửi lại:
@font-face {
font-family: 'Asap';
font-style: normal;
font-weight: 400;
src: local('Asap'), local('Asap-Regular'), url(http://themes.googleusercontent.com/static/fonts/asap/v1/-KZsao_xwBpcExaHoPH8_w.ttf) format('truetype');
}
@font-face {
font-family: 'Asap';
font-style: normal;
font-weight: 700;
src: local('Asap Bold'), local('Asap-Bold'), url(http://themes.googleusercontent.com/static/fonts/asap/v1/5DVGWnz9Skaq1amwwwGZEw.ttf) format('truetype');
}
@font-face {
font-family: 'Asap';
font-style: italic;
font-weight: 400;
src: local('Asap Italic'), local('Asap-Italic'), url(http://themes.googleusercontent.com/static/fonts/asap/v1/8YIp-EIJXA6NJdTPxy9qiQ.ttf) format('truetype');
}
@font-face {
font-family: 'Asap';
font-style: italic;
font-weight: 700;
src: local('Asap Bold Italic'), local('Asap-BoldItalic'), url(http://themes.googleusercontent.com/static/fonts/asap/v1/_sVKdO-TLWvaH-ptGimJBaCWcynf_cDxXwCLxiixG1c.ttf) format('truetype');
}
Điều đơn giản nhất để làm là quay lại Phông chữ web của Google, tải xuống phông chữ được đề cập bằng cách đi here và nhấp vào mũi tên tải xuống.
Sau đó, bạn có thể sử dụng suggested fix from here, tham khảo các tập tin phông chữ bạn đã tải về:
@font-face {
font-family: ‘MyWebFont’;
src: url(‘webfont.eot’);
src: url(‘webfont.eot?#iefix’) format(‘embedded-opentype’),
url(‘webfont.svg#svgFontName’) format(‘svg’),
url(‘webfont.woff’) format(‘woff’),
url(‘webfont.ttf’) format(‘truetype’);
}
Cảm ơn rất nhiều vì câu trả lời của bạn! Tôi đã không sử dụng nó trong một thời gian, và "gần như" khiến nó hoạt động. Vấn đề là, với phương pháp phông chữ tự lưu trữ mới, tất cả các trình duyệt dường như hiển thị phông chữ khác với liên kết yêu cầu biểu định kiểu google gốc. Firefox và IE hiển thị nó lớn hơn một chút và nhiều chất béo/đậm hơn, và Chrome dường như làm cho nó tốt hơn một chút, nhưng cũng không hoàn toàn đúng. Vui lòng tham khảo hình ảnh ví dụ bên dưới. ! Http: //www.gadaffi.dk/example.jpg Bất kỳ ý tưởng nào? :/ – Farsen
Như tôi đã đề cập, Google webfonts sử dụng trình duyệt để phát hiện - do đó, nó sẽ gửi lại một cái gì đó hơi khác nhau, phù hợp với trình duyệt của người dùng đang đưa ra yêu cầu. Không có giải pháp hoàn hảo cho việc này. Lời khuyên của tôi sẽ là để nói chung ngừng nhắm tới điểm ảnh cho phù hợp với trình duyệt chéo hoàn hảo - nó không phải làm việc theo cách đó. –
Dường như vì đây là sự cố Windows/Chrome, họ có thể khắc phục sự cố DirectWrite với trình duyệt hoặc như đã đề cập ở trên, hãy sửa lệnh svg trên phông chữ google apis. Dù bằng cách nào, tôi trông giống như nó thông qua thông qua một chipper gỗ trên windows 8 + chrome. – Mark