×

Các Phương Thức Định Dạng Văn Bản Trong CSS

CSS cung cấp nhiều phương thức để định dạng văn bản, giúp cải thiện sự trình bày và trải nghiệm người dùng. Dưới đây là các phương thức phổ biến để định dạng văn bản trong CSS.

1. font-family

Thuộc tính font-family được sử dụng để chỉ định phông chữ của văn bản.

Ví dụ:

p {
    font-family: Arial, sans-serif;
}

2. font-size

Thuộc tính font-size được sử dụng để thiết lập kích thước phông chữ.

Ví dụ:

p {
    font-size: 16px;
}

3. font-weight

Thuộc tính font-weight được sử dụng để thiết lập độ dày của phông chữ.

Ví dụ:

p {
    font-weight: bold;
}

4. font-style

Thuộc tính font-style được sử dụng để thiết lập kiểu phông chữ (chẳng hạn như in nghiêng).

Ví dụ:

p {
    font-style: italic;
}

5. text-align

Thuộc tính text-align được sử dụng để căn chỉnh văn bản.

Ví dụ:

p {
    text-align: center;
}

6. text-decoration

Thuộc tính text-decoration được sử dụng để thêm các trang trí như gạch dưới, gạch ngang, hoặc bỏ gạch dưới.

Ví dụ:

p {
    text-decoration: underline;
}

7. text-transform

Thuộc tính text-transform được sử dụng để biến đổi văn bản thành chữ in hoa, chữ in thường, hoặc chữ cái đầu viết hoa.

Ví dụ:

p {
    text-transform: uppercase;
}

8. line-height

Thuộc tính line-height được sử dụng để thiết lập chiều cao của dòng, ảnh hưởng đến khoảng cách giữa các dòng văn bản.

Ví dụ:

p {
    line-height: 1.5;
}

9. letter-spacing

Thuộc tính letter-spacing được sử dụng để điều chỉnh khoảng cách giữa các ký tự.

Ví dụ:

p {
    letter-spacing: 2px;
}

10. word-spacing

Thuộc tính word-spacing được sử dụng để điều chỉnh khoảng cách giữa các từ.

Ví dụ:

p {
    word-spacing: 4px;
}

11. text-indent

Thuộc tính text-indent được sử dụng để thụt đầu dòng của đoạn văn bản.

Ví dụ:

p {
    text-indent: 30px;
}

12. color

Thuộc tính color được sử dụng để thiết lập màu chữ.

Ví dụ:

p {
    color: #333;
}

13. white-space

Thuộc tính white-space được sử dụng để kiểm soát cách văn bản được xử lý khi có khoảng trắng, xuống dòng, v.v.

Ví dụ:

p {
    white-space: nowrap;
}

14. text-shadow

Thuộc tính text-shadow được sử dụng để thêm bóng đổ cho văn bản.

Ví dụ:

p {
    text-shadow: 2px 2px 4px #aaa;
}

Kết luận

CSS cung cấp nhiều thuộc tính để định dạng và điều chỉnh văn bản, giúp tạo ra các thiết kế web hấp dẫn và dễ đọc. Hiểu và sử dụng đúng các thuộc tính này sẽ giúp bạn kiểm soát tốt hơn về cách trình bày văn bản trên trang web của mình.

Comments