Trước phía trên nếu bạn muốn website chạy hầu hết font chữ độc với lạ mà lại trên máy tính của Client không thiết lập thì đó là điều không thể, trừ khi client tải về về và cài đặt lên trên máy tính của họ.
Bạn đang xem: Use multiple @font
font-face, rule này sẽ tạo ra một font định danh cùng nó vẫn trỏ tới một file font làm sao đó lưu trữ trên Internet. Điều này đã giúp những Designer thỏa mức độ bung ý tưởng của chính bản thân mình mà ko còn lo âu vấn đề fonts format nữa.
Trước tiên họ cùng tìm hiểu một số format của tệp tin fonts sẽ nhé.
1. Một số định dạng tệp tin font
Mình xin trích một trong những định nghĩa đem từ trang W3C.
Bài viết này được đăng trên
TrueType Fonts (TTF): TrueType là một trong những định dạng được trở nên tân tiến vào cuối trong năm 1980 bởi táo và Microsoft, đấy là định dạng font phổ biến cho những hệ quản lý Mac OS cùng Windows.
OpenType Fonts (OTF): OpenType là một định dạng được cải tiến và phát triển dựa trên nền tảng của TrueType và nó sẽ được đk thương hiệu vì chưng Microsoft. Font text OpenType được sử dụng phổ biến hiện nay trên các nền tảng máy tính xách tay lớn.
The Web xuất hiện Font Format (WOFF): WOFF là 1 trong định dạng sử dụng trong những trang web, nó được cải cách và phát triển vào năm 2009. WOFF thực chất là một OpenType hoặc TrueType được bổ sung một số siêu tài liệu giúp bài toán truyền download qua mạng thanh thanh hơn. W3C khuyến khích áp dụng định dạng này.
The Web open Font Format (WOFF 2.0): TrueType/OpenType là một phiên bản nén tuyệt vời và hoàn hảo nhất hơn WOFF 1.0.
SVG Fonts/Shapes: SVG Fonts giúp hiển thị văn bản giống như 1 hình ảnh Graphic.
Embedded OpenType Fonts (EOT): EOT là một hình thức nén của OpenType, được cải tiến và phát triển bởi Microsoft và dùng làm nhúng vào website.
Với danh sách các kiểu font như trên thì liệu tất cả các trình chuẩn y có cung ứng hết không? Để trả lời câu hỏi này bạn xem thêm bảng danh sách sau:
| TTF/OTF | 9.0* | 4.0 | 3.5 | 3.1 | 10.0 |
| WOFF | 9.0 | 5.0 | 3.6 | 5.1 | 11.1 |
| WOFF2 | Not supported | 36.0 | 35.0* | Not supported | 26.0 |
| SVG | Not supported | 4.0 | Not supported | 3.2 | 9.0 |
| EOT | 6.0 | Not supported | Not supported | Not supported | Not supported |
2. áp dụng
font-face
font-face y hệt như một function gom nhiều thuộc tính CSS lại kết hợp với định dạng font giúp tạo nên những một số loại font theo nguyện vọng của lập rình viên.
Ví dụ:
font-face font-family: MyFont; src: url(sansation_light.woff); font-weight: 100;h2 font-family: MyFont;
Đường dẫn trỏ tới tệp tin font bạn có thể sử dụng CDN của Google hoặc trực tiếp bên trên host của bạn.
Thuộc tính này cũng không tồn tại gì đặc biệt, chúng ta có thẻ tham khảo thêm tại đây.
Xem thêm: Phí Hải Quan Tiếng Anh Là Gì ? Phí Hải Quan Tiếng Anh Là Gì
3. Lời kết
Đa số những layout hiện giờ đều sử dụng những font bắt đầu và lạ nên việc sử dụng
font-face nhập vai trò hết sức quan trọng.
Bài này dứt tại đây, bài tiếp theo họ tìm hiểu 2 chiều Transform vào CSS3.