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

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
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

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom