1. 块级元素(display: block)
1.1. 独占一行
1.2. 高度、宽度、行高、顶和底边距 可设置
1.3. 默认宽度 父容器100%

2. 内联元素(display: inline)
2.1 和其他元素同一行
2.2 高度、宽度、顶和底边距 不可设置
2.3 宽度是其包含的文字和图片的宽度,不可改变

3. 内联块状元素(display: inline-block)
3.1 和其他元素同一行
3.2 高度、宽度、行高、顶和底边距 可设置

4. absolute和float可改变display
position:absolute、float:left 或 float:right 会使元素变为 display: inline-bolck 显示
元素 默认宽度 不占满 父元素
可设置 width 和 height

css display 总结的更多相关文章

  1. CSS display:inline-block

    CSS display:inline-block 在css布局里,我们经常看到代码 「display:inline-block; *display:inline; zoom:1; 」,大多人会说上面的 ...

  2. [转]CSS Display(显示) 与 Visibility(可见性)

    CSS Display(显示) 与 Visibility(可见性) display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏. 隐藏元素 - display:non ...

  3. CSS display:inline和float:left两者区别探讨

     本文和大家重点讨论一下CSS display:inline和float:left两者的区别,CSS display是指显示状态,inline表示内联,特点是紧贴着前一个内联元素,通常默认的内联元素有 ...

  4. CSS Display(显示) 与 Visibility(可见性)

    display属性设置一个元素应如何显示,visibility属性指定一个元素应可见还是隐藏. Box 1 Box 2 Box 3 隐藏元素 - display:none或visibility:hid ...

  5. [CSS3] CSS Display Property: Block, Inline-Block, and Inline

    Understanding the most common CSS display types of block, inline-block, and inline will allow you to ...

  6. CSS display:table属性用法- 轻松实现了三栏等高布局

    display:table:此元素会作为块级表格来显示(类似 <table>); display:table-cell属性指让标签元素以表格单元格的形式呈现,类似于td标签.目前IE8+以 ...

  7. CSS display:inline-block的元素特点:

    将对象呈递为内联对象,但是对象的内容作为块对象呈递.旁边的内联对象会被呈递在同一行内,允许空格. 在CSS中,块级对象元素会单独占一行显示,多个block元素会各自新起一行,并且可以设置width,h ...

  8. CSS DISPLAY AND POSITIONING

    CSS DISPLAY AND POSITIONING Review: Layout Great job! In this lesson, you learned how to control the ...

  9. CSS Display(显示)和Visibility(可见性)

    CSS Display(显示)和Visibility(可见性) 一.简介 display属性设置一个元素应如何显示(隐藏不占用空间),visibility属性指定一个元素应可见还是隐藏(隐藏占用空间) ...

  10. css display属性详解

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

随机推荐

  1. 控件(弹出类): ToolTip, Popup, PopupMenu

    示例1.ToolTip 的示例Controls/FlyoutControl/ToolTipDemo.xaml <Page x:Class="Windows10.Controls.Fly ...

  2. 浅析jQuery(function(){})与(function(){})(jQuery)之间的区别

    本篇文章主要是对jQuery(function(){})与(function(){})(jQuery)之间的区别进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 Jquery是优秀的Javas ...

  3. 网络爬虫3-使用LIB_http库

    LIB_http库提供了一个包装函数集,来简化复杂的PHP/CURL接口 1.http_get()函数,使用GET方法下载文件

  4. ftp,http,https有啥区别?

    [ftp与http的区别?] HTTP(Hyper Text Transmission Protocol)是超文本传输协议,FTP(FileTransferProtocol)是文件传输协议! HTTP ...

  5. Struts2拦截器模拟

    前言: 接触Struts2已经有一段时间,Student核心内容就是通过拦截器对接Action,实现View层的控制跳转.本文根据自身理解对Struts2进行一个Java实例的模拟,方便大家理解! 示 ...

  6. c# 监听文件夹动作

    static FileSystemWatcher watcher = new FileSystemWatcher(); /// <summary>        /// 初始化监听     ...

  7. 分区还原工具(DiskGenius)

    不小心删除的分区可以实用DiskGenius进行还原. 下载地址:http://www.upantool.com/qidong/2012/DiskGenius_3.7.1.html 操作方法: 打开D ...

  8. Fckeditor PHP/ASP File Upload Vul

    目录 . 漏洞描述 . 漏洞触发条件 . 漏洞影响范围 . 漏洞代码分析 . 防御方法 . 攻防思考 1. 漏洞描述 FCKeditor是目前最优秀的可见即可得网页编辑器之一,它采用JavaScrip ...

  9. C#的参数修饰符out,params,ref

    using System; namespace ParamsProgram { class TestParams { public static void Main(string[] args)//s ...

  10. Error: cannot find a valid baseurl for repo: rpmfusion-free 解决办法

    今天在玩CentOS的时候出现了: Error: cannot find a valid baseurl for repo: rpmfusion-free 这个问题真到好恶心啊,以前一直使用到是ubu ...