---恢复内容开始---

http://www.w3school.com.cn/cssref/pr_class_display.asp

所有主流浏览器都支持 display 属性，如IE，Firefox，Chrome，Safari，Opera；

如果规定了 !DOCTYPE，则 Internet Explorer 8 （以及更高版本）支持属性值 "inline-table"、"run-in"、"table"、"table-caption"、"table-cell"、"table-column"、"table-column-group"、"table-row"、"table-row-group"、以及 "inherit"。

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

css语法  display:value;

js语法  Object.style.display=value；

可能的值

部分属性详解：

1. block

特点：1）独占一行；

2）元素的高度，宽度，行高以及顶和底边距均可设置；

3）不设置宽度时，宽度撑满一行；

块级元素有：<div> , <p> , <h1> .. <h6> , <ol> , <ul> , <dl> , <table> , <address> , <blockquote> , <form> , <article> , <header> , <footer> , <nav> , <section> , <html> , <body> 等；

不支持样式：vertical-align；

2. inline

特点：1）和其他元素在一行；

2）内容撑开宽度，即元素的宽度就是它包含的文字或图片的宽度，不可改变；

3）宽高不可设置；

4）代码换行被解析成空格；

内联元素有：<a> , <span> , <br> , <i> , <em> , <strong> , <label> , <q> , <var> , <cite> , <code> , <area> , <del> , <label> , <map> , <mark> , <output> , <pre>  等；

不支持样式：background-position ；clear ；clip ；height | max-height | min-height ；width | max-width | min-width ；overflow ；text-align ；text-indent ；text-overflow；

3. inline-block

特点：1）不设置宽高时，内容撑开高度；

2）非独占一行；

3）可设置宽高；

4）代码换行被解析成空格；

标签：<audio> ，<button>，<canvas>，<embed>，<iframe>，<img>，<input>，<keygen>，<meter>，<object>，<progress>，<select>，<textarea>，<video>

不支持样式：clear ;

4. none

特点：隐藏元素并脱离文档流；

标签：<base>，<link>，<meta>，<title>，<datalist>，<dialog>，<param>，<script>，<source>，<style>

5. list-item

特点：1）不设宽度时，宽度撑满一行；

2）独占一行；

3）可设置宽高；

6. table

特点：1）不设置宽度时，宽度由内容撑开；

2）非独占一行；

3）支持宽高；

4）默认具有表格特征，可设置table-layout、border-collapse、border-spacing等表格专有属性；

7. table-cell

特点：1）不设置宽度时，宽度由内容撑开；

2）非独占一行；

3）支持宽高；

4）垂直对齐；

5）同级等高；

---恢复内容结束---

CSS display属性学习的更多相关文章

  1. css display属性详解

    css display属性在对css做layout设计时非常重要,它的值有以下几种: Value Description Play it inline Default value. Displays ...

  2. CSS display 属性

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

  3. CSS display属性的值及作用

    display 的属性值有:none|inline|block|inline-block|list-item|run-in|table|inline-table|table-row-group|tab ...

  4. CSS Display属性与盒模型

    由于HTML流式文档的特性,页面布局往往是新手最为头疼的问题之中的一个. 每一个HTML元素都会渲染为一个Box,可分为inline Box和block Box. 依据display属性的不同.Box ...

  5. Display属性学习总结

    HTMl元素根据表现形式,常见的可以分为两类. (1)块元素(block) (2)行内元素(inline). 当然,除了以上两种元素类型外,还有inline-block.table-cell等元素类型 ...

  6. css display属性

    C:内联元素加上display:block后被块级化.块级元素一般是其他元素的容器,可容纳内联元素和其他块状元素,块级元素排斥其他元素与其位于同一行,width和height起作用.因此,可以定义其宽 ...

  7. CSS display 属性详解

    定义display 属性设置是否及如何显示元素. 继承性: No 说明 这个属性用于定义建立布局时元素生成的显示框类型.对于 HTML 等文档类型,如果使用 display 不 谨慎会很危险,因为可能 ...

  8. CSS 3 属性学习 —— 2. RGBA

    RGBA 是 CSS3 中用来控制颜色的单位,分别是 Red Green Blue 三原色和 Alpha 透明度的缩写. 也就是说该属性可以帮助我们在设置颜色的同时,也设置了其透明度. 其实就是 RG ...

  9. CSS 3 属性学习 —— 1. Gradient 渐变

    CSS3 中渐变分为: 线性渐变(linear-gradient)和径向渐变(radial-gradient)两种. 1. 线性渐变 参数:  <linear-gradient> = li ...

随机推荐

  1. spring boot integrated mybatis three ways！--转

    https://github.com/spring-projects/spring-boot/issues/5400 一.使用mybatis-spring-boot-starter1.添加依赖 org ...

  2. sql server 数据库distinct的用法

    Distinct:用来过滤重复记录.往往只用它来返回不重复记录的条数,而不是用它来返回不重记录的所有值.其原因是distinct只有用二重循环查询来解决,而这样对于一个数据量非常大的站来说,无疑是会直 ...

  3. Servlet基础(一)

    JavaEE:企业级开发技术 <一.基础概念>j2ee:jdk1.1--1.4   ----->>    j2ee1.1   1.2   javaee:jdk--5,6,7   ...

  4. 你不知道的JavaScript（九）switch语句

    在c/c++.java这些强类型的语言中switch语句的表达式和case分支中的条件值都只能是char类型或整数.JS的switch语句有些不同,它可以是JS中的任意一种类型,这一点有些朋友可能并没 ...

  5. （转载）Android之有效防止按钮多次重复点击的方法(必看篇)

    为了防止测试妹子或者用户频繁点击某个按钮,导致程序在短时间内进行多次数据提交or数据处理,那到时候就比较坑了~ 那么如何有效避免这种情况的发生呢? 我的想法是,判断用户点击按钮间隔时间,如果间隔时间太 ...

  6. 如何在Windows下安装Linux子系统(Ubuntu,openSUSU,SUSU Linux Server)

    注意:只有win10才能安装,安装的linux没有图形界面. 1.首先在win10设置 --> 更新与安装 --> 针对开发人员 ,选择开发人员模式. 2.win10 Cortana -- ...

  7. SQLServer 错误: 15404,维护计划无法执行

    错误症状: D:\Program Files\Microsoft SQL Server\MSSQL.1\MSSQL\LOG下面的ERROELOG,用文本打,查看运行维维计划不成功是生成的错误日志详细信 ...

  8. vector ----- size函数注意事项

    vector 的size函数返回vector大小,返回值类型为size_type,Member type size_type is an unsigned integral type,即无符号整数: ...

  9. [AHOI2013]作业 莫队 树状数组

    #include<cmath> #include<cstdio> #include<algorithm> #include<string> #inclu ...

  10. 解决IIS服务器部署 字体图标找不到的原因

    引言 我们往往在IIS上部署Web项目,或者发布Web项目的时候,经常会遇到浏览器找不到字体文件(woff/woff2)产生的错误.这样会导致浏览器无法加载字体图标,在影响加载时间的同时,更无法显示对 ...