Border-collapse là gì là một trong những keyword được search nhiều nhất trên Google về chủ đề border-collapse là gì. Trong bài viết này, xaydungweb.vn sẽ viết bài viết Border-collapse là gì? Tại sao chúng ta cần hiểu về thuộc tính border-collapse?
Border-collapse là gì? Tại sao chúng ta cần hiểu về thuộc tính border-collapse?
định nghĩa và dùng
tính chất border-collapse định hình đường viền của table có tách biệt ra hay không.
chú ý là tính chất border-collapse chỉ được sử dụng cho thành phần table.
Cấu trúc
table
border-collapse: giá trị;
Với giá trị giống như sau:
| thuộc tính | giá trị | ví dụ | mô tả |
|---|---|---|---|
| border-collapse | collapse | border-collapse: collapse; | Khoảng trống giữa các đường viền (border) của table bị loại bỏ, chỉ còn đường viền duy nhất. |
| separate | border-collapse: separate; | Khoảng trống giữa các đường viền (border) của table luôn luôn giữ nguyên, đây là dạng mặc định của table. | |
| inherit | border-collapse: inherit; | xác định thừa hưởng tính chất từ thành phần cha (thành phần bao ngoài). |
ví dụ
HTML viết:
| Thu hai | Thu ba |
|---|---|
| 2000d | 5000d |
| 500d | 4000d |
Hiển thị trình duyệt khi chưa có CSS:
| Thu hai | Thu ba |
|---|---|
| 2000d | 5000d |
| 500d | 4000d |
CSS viết:
table
border-collapse: collapse;
Hiển thị trình duyệt khi có CSS:
| Thu hai | Thu ba |
|---|---|
| 2000d | 5000d |
| 500d | 4000d |
nguồn: hocwebchuan.com
