display的屬性以及作用

下方是來自w3c的實行表格(部分):
參考鏈接: http://www.cnblogs.com/thislbq/p/5914210.html

描述
none 元素不被顯示
block 元素顯示為塊狀元素,元素前后會有換符
inline 默認,元素會被顯示為內(nèi)聯(lián)元素,元素前后沒有換行符
inline-block 行內(nèi)元素
list-item 元素作為列表顯示
run-in 元素根據(jù)元素上下文來決定是塊級元素或者內(nèi)聯(lián)元素
table 元素作為塊級表格顯示(類似<table>),元素前后有換行符號
inline-table 元素作為內(nèi)聯(lián)表格顯示(類似<table>),元素前后無換行符號
table-row-group 元素作為一個或多個行的分組顯示,類似<tbody>
table-row 元素作為一個表格行顯示,類似<tr>
table-cell 元素作為一個表格單元格顯示,類似<td>,<th>

常用的屬性:none, block, inline, inline-block

  1. none: 元素不顯示而且空間不會保留
    (注意:有另外一個屬性visibility: hidden,此屬性元素不顯示但是空間保留)
  2. block: 塊級元素,前后有換行符,可設(shè)置width、height,元素獨占一行
  3. inline: 內(nèi)聯(lián)元素,display的默認值,前后沒有換行符,無法設(shè)置width,height,不獨占一行
  4. inline-block: 行內(nèi)塊級元素,可設(shè)width,height的內(nèi)聯(lián)元素
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽?zāi)J的外補...
    _Yfling閱讀 14,109評論 1 92
  • 一:在制作一個Web應(yīng)用或Web站點的過程中,你是如何考慮他的UI、安全性、高性能、SEO、可維護性以及技術(shù)因素的...
    Arno_z閱讀 1,360評論 0 1
  • ?前端面試題匯總 一、HTML和CSS 21 你做的頁面在哪些流覽器測試過?這些瀏覽器的內(nèi)核分別是什么? ...
    Simon_s閱讀 2,365評論 0 8
  • 轉(zhuǎn)載請聲明 原文鏈接地址 關(guān)注公眾號獲取更多資訊 第一部分 HTML 第一章 職業(yè)規(guī)劃和前景 職業(yè)方向規(guī)劃定位...
    前端進階之旅閱讀 16,866評論 32 459
  • 本課來自http://www.imooc.com/learn/9請不要用作商業(yè)用途。 HTML5 HTML介紹 H...
    PYLON閱讀 3,447評論 0 5

友情鏈接更多精彩內(nèi)容