css中display屬性詳解

2021-07-11 13:51:40 字數 863 閱讀 5094

display屬性值:

none 此元素不會被顯示。

block 此元素將顯示為塊級元素,此元素前後會帶有換行符。

inline 預設。此元素會被顯示為內聯元素,元素前後沒有換行符。

inline-block 行內塊元素。(css2.1 新增的值)

list-item 此元素會作為列表顯示。

run-in 此元素會根據上下文作為塊級元素或內聯元素顯示。

compact css 中有值 compact,不過由於缺乏廣泛支援,已經從 css2.1 中刪除。

marker css 中有值 marker,不過由於缺乏廣泛支援,已經從 css2.1 中刪除。

table 此元素會作為塊級**來顯示(類似 ),**前後帶有換行符。

inline-table 此元素會作為內聯**來顯示(類似 ),**前後沒有換行符。

table-row-group 此元素會作為乙個或多個行的分組來顯示(類似 )。

table-header-group 此元素會作為乙個或多個行的分組來顯示(類似 )。

table-footer-group 此元素會作為乙個或多個行的分組來顯示(類似 )。

table-row 此元素會作為乙個**行顯示(類似 )。

table-column-group 此元素會作為乙個或多個列的分組來顯示(類似 )。

table-column 此元素會作為乙個單元格列顯示(類似 )

table-cell 此元素會作為乙個**單元格顯示(類似 和 )

table-caption 此元素會作為乙個**標題顯示(類似 )

inherit 規定應該從父元素繼承 display 屬性的值。

詳解css中的display屬性

首先,所有主流瀏覽器都支援 display 屬性。其次,我們都知道display 屬性規定元素應該生成的框的型別。預設值 inline 我們常用的display屬性值有 inline block inline block none 把 display 設定成 none 不會保留元素本該顯示的空間,但...

css 中display屬性認識

none 設定元素不顯示。相當於對應元素不存在,不佔據空間。可以改善重排和重繪,這個不懂,需要去了解 inline 行內元素,顯示在一行。設定的width,height,text align都不起作用。設定line height可以讓文字垂直居中 block 設定元素為塊級。inline block...

CSS中的display屬性

display中文為顯示的意識,顯而易見它的功能就是為了控制頁面元素顯示方式 display中為我們提供了很多屬性,其中最常見的有 none屬性代表著元素不會被顯示 比如很多 的頂部導航欄都會有二級選單,只有當我們的滑鼠移動或點選時二級選單才會顯示出來。這是就可以使用到display none這個屬...