Open font width with font-face
@ font-face cho phép bạn sử dụng
phông chữ, ngay cả khi nó không được cài đặt trên máy tính của người đang duyệt, bằng cách cho phép bạn chỉ định đường dẫn đến bản sao của phông chữ, phông chữ này sẽ được tải xuống nếu nó không có trên máy của người dùng.
Bởi vì kỹ thuật này cho phép
một phiên bản của phông chữ sẽ được tải xuống máy tính của người dùng, điều quan trọng là giấy phép cho phông chữ cho phép nó được sử dụng theo cách này.
Bạn thêm phông chữ vào biểu định kiểu của mình bằng cách sử dụng quy tắc @ font-face, như được hiển thị ở bên phải.
font-family
Điều này chỉ định tên của phông chữ. Sau đó, tên này có thể được sử dụng làm giá trị của thuộc tính font-family trong phần còn lại của biểu định kiểu (như được hiển thị trong quy tắc cho các phần tử <h1> và <h2>).
src
Điều này chỉ định đường dẫn đến phông chữ. Để kỹ thuật này hoạt động trên tất cả các trình duyệt, bạn có thể sẽ cần chỉ định đường dẫn đến một vài phiên bản phông chữ khác nhau, như được hiển thị trên trang tiếp theo.
định dạng
Điều này chỉ định định dạng mà phông chữ được cung cấp.
Nhiều nhà sản xuất kiểu chữ không cho phép bạn sử dụng phông chữ của họ theo cách này, nhưng có những phông chữ mã nguồn mở bạn có thể sử dụng thoải mái. Bạn có thể tìm thấy danh sách của chúng tại:
Khi xem phông chữ trên các trang web này, điều quan trọng vẫn là kiểm tra thỏa thuận cấp phép của phông chữ vì một số phông chữ chỉ miễn phí cho mục đích sử dụng cá nhân (nghĩa là không sử dụng trên các trang web thương mại).
Có một số trang web cung cấp cho bạn quyền truy cập để sử dụng các phông chữ thương mại, vì họ đã thương lượng cho phép khách hàng của họ sử dụng các phông chữ này với một khoản phí:
Google cũng cung cấp các phông chữ mã nguồn mở. Thay vì thêm quy tắc @ font-face vào biểu định kiểu của riêng bạn, bạn liên kết đến tệp CSS và tệp phông chữ trên máy chủ của chúng: www.google.com/webfonts
إرسال تعليق