Kết quả tìm kiếm với tag ""

Kiểm tra xem client có font nào đó hay không

Trong bài viết này tôi sẽ trình bày cách kiểm tra xem tại máy client đã cài đặt font chữ nào đó hay chưa. Tôi sử dụng yếu tố mỗi font sẽ có độ dài chữ khác nhau để kiểm tra sự tồn tại của font chữ

Sử dụng @font-face để tạo font chữ theo ý muốn

Với CSS3, bạn sử dụng @font-face để chỉ định cho browser biết font chữ đó lưu trữ online và download xuống để hiển thị.
Khai báo:

@font-face {
    font-family: 'Tên_Font';
    src: url('đường_dẫn_đến_font.eot') format('embedded-opentype'),
         url('đường_dẫn_đến_font.woff') format('woff'),
         url('đường_dẫn_đến_font.ttf') format('truetype'),
         url('đường_dẫn_đến_font.svg#ten_font') format('svg');
}

Việc sử dụng nhiều loại định dạng font ở bên trên để đảm bảo chạy được trên các trình duyệt khác nhau.

Các sử dụng:
Sau khi khai báo như trên thì bạn sử dụng ‘Tên_Font’ như một font hệ thống bình thường khác:

.title {
    font-family: Ten_Font;
}

Bạn có thể sử dụng web-tool sau để convert về 4 định dạng font trên khi mà chỉ có 1 trong 4 font đó: http://convertfonts.com

Chúc bạn thành công và không còn bận tâm với sự bó buộc của lưa chọn font khi thiết kế website nữa.

Sử dụng Google Fonts

CSS và font chữ

Tôi thường chia font chữ (nói đúng hơn là typeface) thành 2 loại là font chữ đều (monospaced) và không đều. Trong font không đều tôi chia thành 2 loại chính là font có chân và font không chân