Sử dụng thuộc tính font-family trong CSS để thiết lập font chữ hiện thị cho các phần tử HTML

PVS

Cộng Sự Đặc Biệt
Thành viên BQT
Tham gia
28/02/2015
Bài viết
14,491
Được Like
10,733
Sử dụng thuộc tính font-family trong CSS để thiết lập font chữ hiện thị cho các phần tử HTML

Thuộc tính font-family được dùng để chỉ ra font cho phần tử. Có hai kiểu tên font:
  • font family chỉ ra font family ví dụ Times New Roman hoặc Arial
  • generic family nhóm các font family có cách hiển thị tương tự nhau ví dụ Serif, Monospace
screenshot_1591151837.png

Ví dụ có HTML như sau:
Mã:
<p class="serif">
   This is a paragraph shown in serif font.
</p>
<p class="sansserif">
   This is a paragraph shown in sans-serif font.
</p>
<p class="monospace">
   This is a paragraph shown in monospace font.
</p>
<p class="cursive">
   This is a paragraph shown in cursive font.
</p>
<p class="fantasy">
   This is a paragraph shown in fantasy font.
</p>

Giờ dùng CSS để thiết lập font chữ cho các đoạn văn trên
Mã:
<style>
    p.serif {
       font-family: "Times New Roman", Times, serif;
    }
    p.sansserif {
       font-family: Helvetica, Arial, sans-serif;
    }
    p.monospace {
       font-family: "Courier New", Courier, monospace;
    }
    p.cursive {
       font-family: Florence, cursive;
    }
    p.fantasy {
       font-family: Blippo, fantasy;
    }
</style>

Kết quả:

screenshot_1591151881.png

Lưu ý các giá trị trong font-family cách nhau bằng dấu "," các giá trị này được trình duyệt sử dụng thay thế nhau. Nếu font thứ nhất tìm không ra, nó sử dụng font tiếp theo ...

Mã:
body {
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

Chúc các bạn thành công.


Nguồn: Internet​
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS


Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Điện Lạnh Thịnh Phát
Top Bottom