- Trang chủ
- Tham khảo
- CSS
- Thuộc tính line-height
Định nghĩa và sử dụngThuộc tính line-height thiết lập chiều cao giữa các dòng. Cấu trúctag {
line-height: giá trị;
} Với giá trị như sau:
Thuộc tính | giá trị | Ví dụ | Mô tả |
---|
line-height | normal | line-height: normal; | Không tăng khoảng cách giữa các ký tự cho chữ. | Số | line-height: 1.5; | Tăng hoặc giảm khoảng cách giữa các dòng, có thể là số tự nhiên hoặc số thập phân. | Khoảng cách | line-height: 2px; | Tăng hoặc giảm khoảng cách giữa các dòng, đơn vị có thể là px, em, %, ... | inherit | line-height: inherit; | Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài). |
Ví dụMô tả<html>
<head></head>
<body>
<p>HỌC WEB CHUẨN<br />
HTML - HyperText Markup Language<br />
XHTML - Extensible HyperText Markup Language<br />
CSS - Cascading Style Sheets<br />
JS - JavaScript</p>
</body>
</html> line-height normal HTML - HyperText Markup Language XHTML - Extensible HyperText Markup Language CSS - Cascading Style Sheets JS - JavaScript line-height: normal; Không tăng khoảng cách giữa các ký tự cho chữ. normal HTML - HyperText Markup Language XHTML - Extensible HyperText Markup Language CSS - Cascading Style Sheets
JS - JavaScript line-height: normal; Không tăng khoảng cách giữa các ký tự cho chữ. Số length - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi một giá trị cụ thể (giá trị này có thể được xác định theo đơn vị px, em, cm, ....)line-height dùng để thiết lập "chiều cao của mỗi dòng chữ" trong đoạn văn bản. number - - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi cấp số nhân so với kích cỡ chữ của nó.
- Ví dụ: Kích cỡ chữ của đoạn văn bản là 20px - Nếu number là 1 thì sẽ tương đương với 20px
- Ví dụ: Kích cỡ chữ của đoạn văn bản là 20px - Nếu number là 1 thì sẽ tương đương với 20px
- Ví dụ: Kích cỡ chữ của đoạn văn bản là 20px
2) Cách sử dụng thuộc tính line-height trong CSS- Để sử dụng thuộc tính line-height, ta dùng cú pháp như sau:line-height, ta dùng cú pháp như sau: line-height: normal|length|number|percent|initial|inherit;
- Trong đó, ta thấy giá trị của thuộc tính line-height có thể được xác định bởi một trong sáu loại:line-height có thể được xác định bởi một trong sáu loại:
normal | - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi giá trị mặc định của phần tử.
| Xem ví dụ | length | - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi một giá trị cụ thể (giá trị này có thể được xác định theo đơn vị px, em, cm, ....)
| Xem ví dụ | length | - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi một giá trị cụ thể (giá trị này có thể được xác định theo đơn vị px, em, cm, ....) number - - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi cấp số nhân so với kích cỡ chữ của nó.
- - Ví dụ: Kích cỡ chữ của đoạn văn bản là 20px
- Nếu number là 1 thì sẽ tương đương với 20px
- Nếu number là 1.5 thì sẽ tương đương với 30px
| Xem ví dụ | length | - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi một giá trị cụ thể (giá trị này có thể được xác định theo đơn vị px, em, cm, ....) number - - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi cấp số nhân so với kích cỡ chữ của nó.
- - Ví dụ: Kích cỡ chữ của đoạn văn bản là 20px
- Nếu number là 1 thì sẽ tương đương với 20px
- Nếu number là 1.5 thì sẽ tương đương với 30px
| Xem ví dụ | length | - Thiết lập chiều cao của mỗi dòng chữ trong đoạn văn bởi một giá trị cụ thể (giá trị này có thể được xác định theo đơn vị px, em, cm, ....) number
| Xem ví dụ | inherit | - Kế thừa giá trị thuộc tính line-height từ phần tử cha của nó.
| Xem ví dụ | |