Font chữ

Kích thước phông chữ được kiểm soát bởi thuộc tính CSS font-size, như sau:

            h1 {
  font-size: 30px;
}

        

Bài tập: Trong cặp thẻ style, hãy tạo font-size của thẻ p đầu tiên là 16px

Bạn có thể thiết lập font chữ nào nên sử dụng chung, bằng cách sử dụng thuộc tính font-family.
Ví dụ: Nếu bạn muốn đặt phông chữ của phần tử h2 thành sans-serif, bạn sẽ sử dụng CSS như sau:

            h2 {
  font-family: sans-serif;
}

        

Bài tập: Làm cho tất cả các phần tử p của bạn sử dụng phông chữ monospace

Ngoài việc chỉ định phông chữ phổ biến được tìm thấy trên hầu hết các hệ điều hành, chúng ta cũng có thể chỉ định phông chữ web tùy chỉnh non-standard để sử dụng trên trang web của chúng ta.
 
Có nhiều nguồn khác nhau cho phông chữ trên internet, nhưng, trong ví dụ này, chúng tôi sẽ tập trung vào thư viện Google Fonts.
 
Google Fonts là một thư viện phông chữ web miễn phí mà bạn có thể sử dụng trong CSS của mình bằng cách tham chiếu URL của phông chữ.
 
Vì vậy, hãy tiếp tục và nhập và áp dụng phông chữ của Google.
 
Để nhập Google Font, bạn có thể sao chép URL phông chữ từ thư viện Google Fonts và sau đó dán nó vào HTML của bạn. Đối với thử thách này, chúng tôi sẽ nhập phông chữ Roboto. Để thực hiện việc này, hãy sao chép đoạn code sau và dán đoạn mã đó vào phần head của file html của bạn (trước thẻ mở style)

            <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
        

Để sử dụng font chữ này cho các phần tử, chúng ta thêm đoạn CSS sau:


Tên của font-family cần được đặt trong dấu ngoặc đơn ‘’ hoặc ngoặc kép “” nếu tên có khoảng trắng bên trong tên.

Bài tập: Tạo quy tắc CSS font-family sử dụng font chữ Open san từ Google font và áp dụng cho phần tử h2 của bạn.