Chia sẻ kiến thức lập trình web – Lập trình website

Đây là một câu hỏi thường hay được hỏi trong những cuộc phỏng vấn. Nên hôm nay mình làm một bài để phân tích sơ qua cho các bạn thấy được sự khác nhau của 2 thuộc tính css: display none và css visibility hidden

Điểm chung: 2 thuộc tính đều cho phép ẩn đi một element html được nói đến.

Khác nhau:
Bạn xem hình bên dưới sau


display none: thuộc tính sẽ ẩn đi luôn thẻ trong cây html, nhường chỗ cho các thẻ còn lại. Thường dùng thuộc tính này để sử dụng ẩn/hiện trong Jquery
visibility hidden: sẽ ẩn đi nhưng vẫn chiếm khoảng trống trong cây html. Thuộc tính này tương tự như `opacity:0`

Tuỳ vào mục đích sử dụng mà ta chọn thuộc tính nào cho phù hợp.