Thuộc tính visibility

Đăng bởi: Admin

Định nghĩa và sử dụng

Thuộc tính visibility xác định thành phần có được nhìn thấy hay không.

Cấu trúc

tag {
    visibility: giá trị;
}

Với giá trị như sau:

Thuộc tính giá trị Ví dụ Mô tả
visibility collapse visibility: collapse; Làm "sụp đổ" các hàng và cột của thành phần table, giá trị này chỉ sử dụng cho thành phần table.
hidden visibility: hidden; Thành phần sẽ không được nhìn thấy.
visible visibility: visible; Hiển thị thành phần, đây là dạng mặc định.
inherit visibility: 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ụ

HTML viết:

<html>
<head></head>
<body>
<p>HỌC WEB CHUẨN</p>
<p class="visibility">Toán Học</p>
<p>HTML</p>
<p>CSS</p>
</body>
</html>

Hiển thị trình duyệt khi chưa có CSS:

HỌC WEB CHUẨN

Toán Học

HTML

CSS

CSS viết:

p.visibility {
    visibility: hidden;
}

Hiển thị trình duyệt khi có CSS:

HỌC WEB CHUẨN

Toán Học

HTML

CSS

Trình duyệt hỗ trợ

  • Internet Explorer
  • Firefox
  • Opera
  • Google Chrome
  • Safari

Thuộc tính visibility được hỗ trợ trong đa số các trình duyệt.

Giá trị "inherit" và "collapse" không được hỗ trợ trong các trình duyệt trình duyệt Internet Explorer 8 trở xuống

Link liên quan


vncoder logo

Theo dõi VnCoder trên Facebook, để cập nhật những bài viết, tin tức và khoá học mới nhất!

Chia sẻ bài viết