Đường viền bảng html
Các hướng dẫn xây dựng Web được tổ chức tốt và dễ hiểu với rất nhiều ví dụ về cách sử dụng HTML, CSS, JavaScript, SQL, Python, PHP, Bootstrap, Java, XML và hơn thế nữa.
Đường viền bảng HTML
Các bảng HTML có thể có các đường viền với các kiểu và hình dạng khác nhau.
Cách thêm đường viền
Khi bạn thêm đường viền vào bảng, bạn cũng thêm đường viền xung quanh mỗi ô trong bảng:bordertài sản trên table, thvà tdcác yếu tố:
Thí dụ
table, th, td {
border: 1px solid black;
}
Đường viền bảng đã thu gọn
Để tránh có đường viền kép như trong ví dụ trên, hãy đặt thuộc tính CSSborder-collapse thành collapse.Điều này sẽ làm cho các đường viền thu gọn thành một đường viền duy nhất:
Thí dụ
table, th, td {
border: 1px solid black;
border-collapse: collapse;
}
Đường viền bảng kiểu
Nếu bạn đặt màu nền của mỗi ô và đặt đường viền màu trắng (giống như màu nền của tài liệu), bạn sẽ có ấn tượng về một đường viền vô hình:Thí dụ
table, th, td {
border: 1px solid white;
border-collapse: collapse;
}
th, td {
background-color: #96D4D4;
}
Đường viền bàn tròn
Với thuộcborder-radiustính, các đường viền có các góc được làm tròn:Thí dụ
table, th, td {
border: 1px solid black;
border-radius: 10px;
}
Bỏ qua đường viền xung quanh bảng bằng cách bỏ qua
tablebộ chọn css:Thí dụ
th, td {
border: 1px solid black;
border-radius: 10px;
}
Đường viền bảng chấm
Với thuộcborder-styletính, bạn có thể đặt hiện tượng của đường viền.Các giá trị sau được cho phép:
dotteddashedsoliddoublegrooveridgeinsetoutsetnonehidden
Thí dụ
th, td {
border-style: dotted;
}
Màu viền
Với thuộcborder-colortính, bạn có thể đặt màu của đường viền.Thí dụ
th, td {
border-color: #96D4D4;
}
Chủ đề Tương tự
- Tags:
- HTML
- HTML là gì
- TABLE HTML
Không có đánh giá nào.
Viết một đánh giá.
Để bình luận vui lòng Đăng nhập tài khoản ! hoặcĐăng ký mới!
S - Tech
Điện máy
Khoa học
Cuộc sống
Ô tô, Xe máy
Tiện ích
Công nghệ
Video
