2012-02-23 27 views
10

Tôi đang sử dụng font Ubuntu từ Google Fonts:TTF cài đặt cục bộ sẽ ghi đè fonts Google

<link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,300italic,400italic,500,500italic,700,700italic' rel='stylesheet' type='text/css' /> 

stylesheet của tôi:

body { 
    font-family: 'ubuntu',arial; 
} 

Nó hoạt động, nhưng nếu cài đặt một phông chữ có cùng tên (Ubuntu), nó ghi đè lên một từ Google Fonts.

Có thể buộc trình duyệt sử dụng trình duyệt từ Google Fonts không?

Trả lời

11

Câu trả lời không nằm trong mã của bạn, nhưng trong Google.

Dưới đây là một phần của CSS bạn đang yêu cầu:

@font-face { 
    font-family: 'Ubuntu'; 
    font-style: normal; 
    font-weight: bold; 
    src: local('Ubuntu Bold'), local('Ubuntu-Bold'), url('http://themes.googleusercontent.com/static/fonts/ubuntu/v4/0ihfXUL2emPh0ROJezvraLO3LdcAZYWl9Si6vvxL-qU.woff') format('woff'); 
} 

dòng chính ở đây là local('Ubuntu Bold'), mà yêu cầu để tải tập tin địa phương nếu có thể. Giải pháp đơn giản nhất là sao chép tất cả CSS của Google, dán nó vào CSS của riêng bạn và sửa đổi tên local thành, ví dụ: local('Ubuntu Bold NonExisting Name or Something Else'). Phông chữ như vậy không tồn tại và sẽ không thay thế phông chữ được tải bởi CSS.

P.S. Tôi đã không tự mình thử nghiệm điều này. Nếu 0ihfXUL2emPh0ROJezvraLO3LdcAZYWl9Si6vvxL-qU.woff URL hết hạn, thì bạn đang ở một vị trí khó khăn. Hãy thử xem giấy phép của phông chữ và tự cân nhắc việc lưu trữ phông chữ, nếu ngăn chặn ghi đè cục bộ là ưu tiên.

+3

Tại sao thay đổi thành 'local (' Something Nonexistant ') '? Tại sao không chỉ loại bỏ người dân địa phương nên nó chỉ là 'url ('bất cứ điều gì')'? –

+3

Kỹ thuật này (chỉ định tên phông chữ không tồn tại) là cơ sở cho phương pháp 'Smiley'. Sau đó, việc sử dụng ký tự UTF-8 gây ra một số lỗi với Android, do đó phương pháp đó không còn được khuyến nghị nữa. Nhưng tôi cho rằng, có một lý do cho việc hack này. Có thể, một số trình duyệt đã cố gắng phát hiện và tải phông chữ cục bộ. Tuy nhiên, bạn nên thử mà không có 'local()' và xem nó có hoạt động trên mọi trình duyệt hay không. Nó có thể. –

+0

Cảm ơn bạn. Dường như nó hoạt động. Tôi sẽ kiểm tra thêm vào ngày mai và cập nhật câu hỏi này. Tôi bỏ qua những phần địa phương như Matt gợi ý. – Martin

Các vấn đề liên quan