CSS中的display属性

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

span:display:block;

那么span元素就会表现的和DIV一样,每个DIV占据一行,而且支持设置宽高;

具体CSS中的display有如下属性:

one    此元素不会被显示。    
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 属性的值。

CSS中的display属性的更多相关文章

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

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

  2. CSS中的display属性(none,block,inline,inline-block,inherit)

    css中的display属性(none,block,inline,inline-block,inherit) display属性是我们在前端开发中常常使用的一个属性,其中,最常见的有: none bl ...

  3. 细说CSS中的display属性

    相信大部分奋战在前端的,尤其在前端攻城的过程中,有一种越陷越深的感觉,不错,一如前端深似海,从此妹子是浮云啊,前端上手容易,深入难啊!下面我就CSS中的display属性讲下我自己所积累的,与大家共享 ...

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

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

  5. 深入理解css中的margin属性

    深入理解css中的margin属性 之前我一直认为margin属性是一个非常简单的属性,但是最近做项目时遇到了一些问题,才发现margin属性还是有一些“坑”的,下面我会介绍margin的基本知识以及 ...

  6. CSS 中关于background 属性功能

    background 是 css中的核心属性,我们对他应该充分了解. background-image   定义背景图像  这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...

  7. Css中的Position属性

    Css中的Position属性 Css属性在线查询地址: http://www.css88.com/book/css/properties/index.htm CSS 中的 position 属性 在 ...

  8. css中background背景属性概

    css中background背景属性概 background:url(背景图片路径)  no-repeat;/*不重复默认在左上方*/background:url(背景图片路径)  no-repeat ...

  9. 举例详解CSS中的cursor属性

    这篇文章主要举例介绍了CSS中的cursor属性,包括zoom-in/zoom-out和grab/grabbing等常用属性值的使用,需要的朋友可以参考下 一.开篇之言 CSS3的领域范围已经渗透到了 ...

随机推荐

  1. 替换url中某个参数的值或是添加某个参数的方法(js 分页上下页可以使用)

    function changeUrl(base, find, value) { var offset = base.indexOf(find); var index; var rr = ''; if( ...

  2. 手把手教你在Ubuntu上安装Apache、MySql和PHP

    1:首先安装apache:打开终端(ctrl+Alt+t), 输入命令:sudo apt-get install apache2即可安装, 安装完后,打开浏览器,在地址栏输入:localhost或者h ...

  3. 课程笔记:——Javascript 中的预解释1

    1.预解释(变量提升):在当前作用域下,JS代码执行之前,浏览器首先会把所有带var和function关键字的进行提前的声明或者定义var num = 12;声明(declare): var num; ...

  4. mysql命令行以及mysql workbence查询结果中文乱码的解决方法

    最近正在学习mysql,安装环境是windows server 2003 32位操作系统+mysql 5.1.47同时也安装了mysql命令行以及mysql workbench这里是test数据库cr ...

  5. Perl技巧

    项目里面一直用的是Perl,Perl里有各种小技巧就分享在这吧. push(@a, $b) 把b元素压入a数组中, 还可以有 push(@a, [@b]); 那a就成了二维数组了 scalar(@a) ...

  6. margin:0 auto 与 text-align:center

    1.text-align:通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式;            text-align:center 设置文本或img标签等一些内联对象的居中. 2.m ...

  7. Empty 和空字符串区别

    如果 var 是非空或非零的值,则 empty() 返回 FALSE. 换句话说,"".0."0".NULL.FALSE.array().var $var; 以 ...

  8. C语言程序设计第13次作业

    一.本次课主要内容: 本章主要介绍结构的基本概念与定义.结构变量的定义和使用.结构数组应用.结构指针概念.重点介绍结构的定义与成员引用方式.同时也介绍了文件的基本概念,文件操作处理基本步骤和过程,常用 ...

  9. 为什么要学习java?

    前面说了什么是java java只是一门语言,中文,英语,c++,c#等等数之不尽的语言 java的应用领域: 1)安卓应用 2)金融业服务器的应用 3)Java Web应用 4)软件工具 5)交易应 ...

  10. 关于android的UI更新机制与误区

    Android系统的消息队列和消息循环都是主线程的,其它后台服务等无法直接更新,必须通过下面的消息队列,由主线程的消息循环去依次执行更新ui: 同时对于费时间超过5秒的事件,比如网络链接等,建议新开线 ...