CSS3 - Phông chữ Web

Phông chữ web được sử dụng để cho phép các phông chữ trong CSS, không được cài đặt trên hệ thống cục bộ.

Các định dạng phông chữ web khác nhau

Sr.No.	Phông chữ & Mô tả
1	TrueType Fonts (TTF) TrueType là một tiêu chuẩn phông chữ phác thảo được phát triển bởi Apple và Microsoft vào cuối những năm 1980, Nó trở thành phông chữ phổ biến nhất cho cả hệ điều hành windows và MAC.
2	OpenType Fonts (OTF) OpenType là một định dạng cho phông chữ máy tính có thể mở rộng và được phát triển bởi Microsoft
3	The Web Open Font Format (WOFF) WOFF được sử dụng để phát triển trang web và được phát triển vào năm 2009. Hiện nay nó đang được sử dụng theo khuyến nghị của W3C.
4	SVG Fonts/Shapes SVG cho phép phông chữ SVG trong tài liệu SVG. Chúng ta cũng có thể áp dụng CSS cho SVG với thuộc tính font face.
5	Embedded OpenType Fonts (EOT) EOT được sử dụng để phát triển các trang web và nó đã được nhúng vào các trang web nên không cần cho phép phông chữ của bên thứ 3

Đoạn mã sau hiển thị mã mẫu của mặt phông chữ:

<html>
   <head>
      <style>
         @font-face {
            font-family: myFirstFont;
            src: url(/css/font/SansationLight.woff);
         }
         div {
            font-family: myFirstFont;
         }
      </Style>
   </head>
   
   <body>
      <div>This is the example of font face with CSS3.</div>
      <p><b>Original Text :</b>This is the example of font face with CSS3.</p>
   </body>
</html>

Nó sẽ tạo ra kết quả sau:

Mô tả phông chữ

Danh sách sau chứa tất cả mô tả phông chữ được đặt trong quy tắc @ font-face -

Sr.No.	Giá trị & Mô tả
1	font-family Được sử dụng để xác định tên của phông chữ
2	src Được sử dụng để xác định URL
3	font-stretch Dùng để tìm, cách kéo giãn phông chữ
4	font-style Được sử dụng để xác định kiểu phông chữ
5	font-weight Được sử dụng để xác định độ đậm của phông chữ (độ đậm)