• display属性


    display 属性规定元素应该生成的框的类型。

    描述
    none 此元素不会被显示。
    block 此元素将显示为块级元素,此元素前后会带有换行符。
    inline 默认。此元素会被显示为内联元素,元素前后没有换行符。
    inline-block 行内块元素。(CSS2.1 新增的值)
    list-item 此元素会作为列表显示。
    run-in 此元素会根据上下文作为块级元素或内联元素显示。
    compact CSS 中有值 compact,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。
    marker CSS 中有值 marker,不过由于缺乏广泛支持,已经从 CSS2.1 中删除。
    table 此元素会作为块级表格来显示(类似 <table>),表格前后带有换行符。
    inline-table 此元素会作为内联表格来显示(类似 <table>),表格前后没有换行符。
    table-row-group 此元素会作为一个或多个行的分组来显示(类似 <tbody>)。
    table-header-group 此元素会作为一个或多个行的分组来显示(类似 <thead>)。
    table-footer-group 此元素会作为一个或多个行的分组来显示(类似 <tfoot>)。
    table-row 此元素会作为一个表格行显示(类似 <tr>)。
    table-column-group 此元素会作为一个或多个列的分组来显示(类似 <colgroup>)。
    table-column 此元素会作为一个单元格列显示(类似 <col>)
    table-cell 此元素会作为一个表格单元格显示(类似 <td> 和 <th>)
    table-caption 此元素会作为一个表格标题显示(类似 <caption>)
    inherit 规定应该从父元素继承 display 属性的值。

    display的默认值是inline;如果规定了 !DOCTYPE,则 IE8 (以及更高版本)支持属性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-row"、"table-row-group"、以及 "inherit"。
    inline-block和inline是有区别的,前者仍属于block,所以有高宽的属性,而后者没有。

    display:list-item;表示此元素会作为列表显示。

    <p style="display:list-item;list-style:inside square;">这是display:list-item属性</p>

    效果:  · 这是display:list-item属性(由于浏览器不支持粘贴图片,这个效果左边的点是我手动敲上去的=-=)
    display:list-item;可与list-style-type属性共同使用,效果和列表标签一样。

    由于其他元素暂未使用,等使用了再说。

  • 相关阅读:
    堆栈,堆栈,堆和栈的区别(转贴)
    .net cookie跨域和逗号bug的修复
    转:互联网协议入门
    函数式编程stream.js
    用例子验证w3c的stacklevel在不同浏览器中的显示
    JS创建对象的几种方法
    打开Word时总是出现 “Microsoft Office Word 需要 VBA 宏语言支持来完成此操作
    如何解决闭包只能取得包含函数中任何变量的最后一个值
    转:10个javascript简写/优化技巧
    Nicholas C. Zakas如何面试前端工程师
  • 原文地址:https://www.cnblogs.com/fanyx/p/4929320.html
Copyright © 2020-2023  润新知