Chỉ định Kiểu và Trọng lượng cho Phông chữ Google

Tôi đang sử dụng phông chữ của Google trong một số trang của mình và gặp sự cố khi cố gắng sử dụng các biến thể của phông chữ. Ví dụ: http://www.google.com/webfonts#QuickUsePlace:quickUse/Family:Open+Sans

Tôi đang nhập ba mặt, Bình thường, Bold, ExtraBold thông qua thẻ liên kết. Khuôn mặt bình thường hiển thị chính xác, nhưng tôi không thể tìm ra cách sử dụng các biến thể của phông chữ trong CSS của mình

Tôi đã thử tất cả những điều sau làm thuộc tính cho font-family nhưng không có xúc xắc:

• 'Mở Sans Bold'
• 'Mở Sans 700'
• 'Mở Sans Bold 700'
• 'Open Sans: Bold'

Bản thân các tài liệu google không cung cấp nhiều trợ giúp. Bất cứ ai có ý tưởng về cách tôi nên viết các quy tắc CSS của mình để hiển thị các biến thể này?

Họ sử dụng CSS thông thường.

Chỉ cần sử dụng họ phông chữ thông thường của bạn như sau:

font-family: 'Open Sans', sans-serif;

Bây giờ bạn quyết định "trọng lượng" của phông chữ bằng cách thêm

cho nửa đậm

font-weight:600;

cho đậm (700)

font-weight:bold;

cho thêm đậm (800)

font-weight:800;

Như thế này là bằng chứng dự phòng của nó, vì vậy nếu phông chữ google "thất bại" thì phông chữ dự phòng của bạn Arial / Helvetica (Sans-serif) hãy sử dụng cùng trọng lượng với phông chữ google.

Khá thông minh :-)

Lưu ý rằng các trọng lượng phông chữ khác nhau phải được nhập cụ thể thông qua url thẻ liên kết (tham số truy vấn họ của url phông chữ google) trong tiêu đề.

Ví dụ, liên kết sau sẽ bao gồm cả trọng số 400 và 700:

<link href='fonts.googleapis.com/css?family=Comfortaa:400,700'; rel='stylesheet' type='text/css'>

Đây là vấn đề: Bạn không thể chỉ định trọng lượng phông chữ không tồn tại trong bộ phông chữ từ Google. Nhấp vào liên kết XEM CỤ THỂ bên dưới phông chữ, sau đó cuộn xuống phần PHONG CÁCH. Ở đó, bạn sẽ thấy từng "kiểu" có sẵn cho phông chữ cụ thể đó. Đáng buồn thay, Google không liệt kê trọng lượng phông chữ CSS cho mỗi kiểu. Đây là cách các tên liên kết với các số trọng lượng phông chữ CSS:

Thin            100     
Extra Light     200
Light           300
Regular         400
Medium          500
Semi-Bold       600
Bold            700
Black           900

Lưu ý rằng rất ít phông chữ có tất cả 9 trọng số.

font-family:'Open Sans' , sans-serif;

Đối với ánh sáng: font-weight : 100; Hoặc font-weight : lighter;

Đối với bình thường: font-weight : 500; Hoặc font-weight : normal;

Đối với in đậm: font-weight : 700; Hoặc font-weight : bold;

Để rõ hơn: font-weight : 900; Hoặc font-weight : bolder;

bạn có thể sử dụng giá trị trọng lượng được chỉ định trong Google Fonts.

body{
 font-family: 'Heebo', sans-serif;
 font-weight: 100;
}