CSS3: display

CSS 1none

Ẩn phần tử (không có hiệu ứng bố cục) tương ứng; tất cả các phần tử con cũng sẽ bị ẩn, và trang web sẽ coi như những phần tử này không có sẵn.

inlinePhần tử sẽ tạo ra một hoặc nhiều khối phần tử inline.blockChuyển phần tử thành khối.list-itemPhần tử sẽ trở thành một khối nội dung và một khối inline với một danh sách các item.CSS 2.1inline-blockPhần tử sẽ trở thành một khối và sẽ chiếm không gian theo chiều ngang các khối khácCSS 2.1inline-tableGiá trị này không trực tiếp được ánh xạ trong HTML. Khi được áp dụng thì phần tử được coi như là một thẻ <table> trong HTML nhưng dưới dạng khối inline, và bên trong phần tử sẽ là dạng mức khối.tablePhần tử tương ứng sẽ được coi là phần tử <table>. Nó định nghĩa một hộp ở mức khối.table-captionPhần tử tương ứng sẽ được coi là thẻ <caption> trong HTML.table-cellPhần tử tương ứng sẽ được coi là thẻ <td>table-column

Phần tử tương ứng sẽ được coi là thẻ <col>

table-column-group

Phần tử tương ứng sẽ được coi là thẻ

  <colgroup>table-footer-group

Phần tử tương ứng sẽ được coi là thẻ

<tfoot>table-header-group

Phần tử tương ứng sẽ được coi là thẻ

 <thead>table-row

Phần tử tương ứng sẽ được coi là thẻ

 <tr>table-row-group

Phần tử tương ứng sẽ được coi là thẻ

 <tbody>CSS3inline-list-itemBiến phần tử tương ứng thành một list item. Ngoài ra, giá trị bên ngoài của list-style-position được coi là ở bên trong phần tử tương ứng. Nếu không thì phần tử sẽ hiển thị giá trị được coi là nội tuyến.CSS3flexBiến phần tử tương ứng thành phần tử khối và bố cục lại nội dung của nó theo mô hình flexbox (khối cong).inline-flexBiến phần tử tương ứng thành phần tử nội tuyến và bố cục lại nội dung theo mô hình flexbox.CSS3 grid

Biến phần tử tương ứng thành phần tử khối và bố cục lại nội dung theo mô hình grid (đa số các trình duyệt không hỗ trợ giá trị này).

inline-grid

Biến phần tử tương ứng thành phần tử nội tuyến và bố cục lại nội dung theo mô hình grid.

CSS3ruby

Biến phần tử tương ứng thành phần tử nội tuyến và bố cục lại nội dung theo mô hình dạng ruby

. Nó sẽ hoạt động giống với phần tử <ruby>.ruby-base

Biến phần tử tương ứng thành phần tử

 <rb>.ruby-text

Biến phần tử tương ứng thành phần tử

 

<rt>

.

ruby-base-container

Biến phần tử tương ứng thành phần tử

 

<rbc> và được coi là khối nặc danh.ruby-text-container

Biến phần tử tương ứng thành phần tử

 

<rtc>

.

Các giá trị thử nghiệmrun-in

  • Nếu hộp run-in chứa một khối thì phần tử tương ứng được coi là khối.
  • Nếu khối nằm sau hộp run-in thì hộp run-in trở thành hộp nội tuyến đầu tiên của khối.
  • Nếu hộp nội tuyến nằm sau thì hộp run-in trở thành một hộp khối.

contentsBản thân phần tử tương ứng sẽ không tạo ra một hộp cụ thể nào, nó được thay thế bởi hộp giả và các hộp con của nó.