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属性共同使用,效果和列表标签一样。

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

display属性的更多相关文章

  1. CSS HTML元素布局及Display属性

    本篇文章主要介绍HTML的内联元素.块级元素的分类与布局,以及dispaly属性对布局的影响. 目录 1. HTML 元素分类:介绍内联元素.块级元素的分类. 2. HTML 元素布局:介绍内联元素. ...

  2. 深入理解和应用display属性(二)

    四.inline-block 此类元素是inline + block的合体 1) margin和padding都有效:width和height都有效: .inline{ display: inline ...

  3. CSS中的display属性

    CSS中的display属性 display:block是可以把非块级元素强制转换为块级元素显示,如内嵌元素span,原来不支持设置宽高,宽度是由内容撑开的,几个span元素是在同一行内的,如果给sp ...

  4. 深入理解display属性

    display 属性在网页布局中很常见,但是之前一直不了解他的各个属性的区别,只是简单的使用block.none属性,对于其他属性都不清楚,今天详细的学习和实践display属性的各个方面 定义 di ...

  5. Code笔记之:CSS+HTML display 属性

    display属性值:none 此元素不会被显示. block 此元素将显示为块级元素,此元素前后会带有换行符. inline 默认.此元素会被显示为内联元素,元素前后没有换行符. inline-bl ...

  6. 理解与应用css中的display属性

    理解与应用css中的display属性 display属性是我们在前端开发中常常使用的一个属性,其中,最常见的有: none block inline inline-block inherit 下面, ...

  7. CSS display 属性

    实例 使段落生出行内框: p.inline { display:inline; } 所有主流浏览器都支持 display 属性. 注释:如果规定了 !DOCTYPE,则 Internet Explor ...

  8. 对CSS进行wxss思路学习,display属性。

    先来概要一下学习思路: 本系列内容,将针对微信小程序中的WXSS学习,所以在学习CSS时每一个知识点都在小程序IDE中进行实践,达到最好的学习效果. 由于wxss与CSS有些许不同,在学习CSS过程中 ...

  9. 转: 详解css中的display属性

    在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例讲解方法 ...

  10. CSS visibility与display 属性

    所有主流浏览器都支持 visibility 属性. 注释:任何的版本的 Internet Explorer (包括 IE8)都不支持 "inherit" 和 "colla ...

随机推荐

  1. java操作impala

    public class App { static String JDBC_DRIVER = "com.cloudera.impala.jdbc4.Driver"; static ...

  2. react-redux状态管理思想

    最近一段一直在加班做项目,几乎每天都要加班到晚上9点,每周也只休息一天,一直没有时间把eact全家桶,再整体熟悉一遍.索性,就在最近的项目中,借鉴了react-redux的思想,维护状态和发布acti ...

  3. WPF研究之道——数据驱动UI

    如果有人问你wpf和winform的区别,也许你会说,wpf的界面比较漂亮,wpf有诸多新的理念,的确如此.我今天想说的是wpf的数据驱动UI的理念. 传统的winform,想要更新界面内容,是不是必 ...

  4. Rotational Region CNN

    R2CNN 论文Rotational Region CNN for Orientation Robust Scene Text Detection与RRPN(Arbitrary-Oriented Sc ...

  5. 用Go自己实现配置文件热加载功能

    说到配置文件热加载,这个功能在很多框架中都提供了,如beego,实现的效果就是当你修改文件后,会把你修改后的配置重新加载到配置文件中,而不用重启程序,这个功能在日常中还是非常实用的,毕竟很多时候,线上 ...

  6. [转]SVN使用log,list,cat,diff查看所有及特定文件版本信息

    [转]SVN使用log,list,cat,diff查看所有及特定文件版本信息 http://onefishum.blog.163.com/blog/static/5184730520113153402 ...

  7. JDK1.8源码(二)——java.lang.Integer 类

    上一篇博客我们介绍了 java.lang 包下的 Object 类,那么本篇博客接着介绍该包下的另一个类 Integer.在前面 浅谈 Integer 类 博客中我们主要介绍了 Integer 类 和 ...

  8. Maven 项目生成jar运行时提示“没有主清单属性”

    新建了一个Maven的项目,mvn compile和mvn package后生成了jar文件,然后直接到target目录下去执行java -jar xxx.jar命令运行jar包时出现了"x ...

  9. 项目中用到的node-express模块

    反向代理中间件: var proxyMiddleWare = require("http-proxy-middleware"); var proxyPath = "htt ...

  10. thinkphp3.2-更改控制器名后找不到相应的表?报1146的错

    用tp在做着自己的小系统的时候,明明在刚才还是能好好地查到表的,在Service用了'D'方法连自己数据库的表,只是更改了自己的控制器名,却报错了... 我就纳闷了,虽然我的控制器和Service用的 ...