display有很多的属性值,这边就总结几个常用的属性值吧!

  1. display:none;
    设置元素隐藏,具体可见:display:none
  2. display:block;
    设置元素为块级元素,块级元素可以独占一行,可设宽高。
  3. display:inline;
    设置元素为行内元素,一行可有多个行内块元素,不可设宽高。
  4. display:inline-block
    设置元素为行内块元素,既有行内元素的(一行可有多个)特性,又有块元素的(可设宽高)特性
  5. display:inline-table
    inline-table得到的是,外面是“内联盒子”,里面是“table盒子”。
  6. display:table
    元素会作为块级表格来显示,类似 table,表格前后带有换行符;配合table-cell使用可实现水平垂直居中,具体可见:水平垂直居中
  7. table-row
    元素会作为一个表格行显示,类似 tr;
  8. table-cell
    元素会作为一个表格单元格显示,类似 td和 th。
  9. display:list-item
    为元素内容生成一个块型盒,随后再生成一个列表型的行内盒。
    会把元素作为列表显示,要完全模仿列表的话还需要加上 list-style-position,list-style-type
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐