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. (原创)如何使用selenium 驱动chrome浏览器并且打开方式为手机模式-转载请注明出处

    随着移动设备使用率的不断增加,移动页面的测试也变得越来越重要. 对于互联网公司M站的测试,如果不通过专用的appium等移动端测试工具是否还有方便快捷的办法呢?答案当然是有啊. 使用chrome dr ...

  2. Android中的多线程编程

    问题 Android的UI也是线程不安全的,如果要更新应用程序里的UI元素,必须在主线程中进行,否则就会抛异常.比如用一个Button的onClick函数去更新界面上的元素,就会得到一个CalledF ...

  3. 大不了高三艹个FZU

    即使做错了也不要紧啊,反正人生就这一次

  4. onBackPressed

    onBackPressed()此为进行返回当前的activity 看源码

  5. google closure--继承模块二:goog.base()demo分析

    昨天已经讲到了goog.inherits(),主要负责通过为子构造函数原型对象通过原型链继承父构造函数的原型对象的方法,完成继承.这样继承只完成了原型对象的继承,看看之前的那张图: 是不是感觉父构造函 ...

  6. AsyncTask异步交互和httpurlconnection结合使用

    //网络请求数据 package com.baidu.myutils; import java.io.BufferedReader; import java.io.InputStreamReader; ...

  7. if 判断中出现逗号

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  8. Git在Windows环境下配置Diff以及Merge工具---DiffMerge

    参考出处:http://coding4streetcred.com/blog/post/Configure-DiffMerge-for-Your-Git-DiffTool主要转自:http://blo ...

  9. css 中content内容特殊形状

    用到的一些特殊字符和图标html代码<div class="cross"></div>css代码.cross{    width: 20px;    hei ...

  10. 最后一次PSP

    PSP: 一.计划 完成这个任务需要五天左右. 二.开发 1.需求分析: 作为一个排球比赛的现场工作人员,我需要统计每一名球员的得分以及技术统计(如:发球,拦网,一传等等),以便于颁发每场比赛的MVP ...