display:block

  1.block元素会独占一行,多个block元素会各种新起一行。默认情况下,block元素宽度自动填满其父元素容器;

  2.block元素可以设置width和height属性,块级元素即使设置宽度还是会独占一行;

  3.block元素可以设置margin和padding;

display:inline

  1.inline元素不会独占一行,多个相邻的行内元素会排在同一行里,直到一行排列不下,才会新起一行,起宽度随元素内容而变化;

  2.inline元素设置width和height无效;

  3.inline元素的margin和padding属性,水平方向的padding-left, padding-right, margin-left, margin-right都产生边距效果;但竖直方向的padding-top, padding-bottom, margin-top, margin-bottom不会产生边距效果;

display:inline-block

  1.将对象呈现为inline对象,但是对象的内容作为block对象呈现,之后的内联对象会被排列在同一行内。比如我们给a标签inline-block属性值,使其既具有block的宽度高度特性又具有inline的同行特性;

block、inline、inline-block对比的更多相关文章

  1. block,inline和inlinke-block细节对比

    block,inline和inlinke-block细节对比 display:block block元素会独占一行,多个block元素会各自新起一行.默认情况下,block元素宽度自动填满其父元素宽度 ...

  2. block,inline和inline-block对比

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  3. block,inline和inline-block概念和区别

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  4. block,inline和inline-block概念和区别(转)

    转自  http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-lev ...

  5. block,inline,inline-block的区别

    block: 英语翻译过来是“块”意思,就跟小时候玩过的积木方块一样,一块一块往上搭. inline: 英语翻译过来就是“内联”的意思,内联不好理解,我的理解就是行内元素: block和inline都 ...

  6. css(二) block,inline和inline-block概念和区别

    转: http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-leve ...

  7. block,inline和inline-block概念和区别(转载)

    转自: http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-lev ...

  8. 2017-08-20 block,inline和inline-block概念和区别

    display:inline.block.inline-block的区别 display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都 ...

  9. Css 中的 block,inline和inline-block概念和区别

    1.block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通常被现 ...

  10. CSS——display(Block none inline等)属性的用法

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

随机推荐

  1. laravel5 数据库连接问题

    [PDOException] SQLSTATE[28000] [1045] Access denied for user ‘homestead’@’localhost’ (using password ...

  2. POJ 3362 Protecting the Flowers

    这题和金华区域赛A题(HDU 4442)是一样的做法. 对两个奶牛进行分析,选择两个奶牛总花费少的方式排序. bool cmp(const X&a,const X&b){ return ...

  3. Android L(5.0)源码之手势识别GestureDetector

    本人新手,最近下了Android L的源码,正在研究手势识别,能力有限,现总结如下: Android识别触摸屏手势使得用户体验大大提高.在View类中有个View.OnTouchListener内部接 ...

  4. 火狐上的一个post提交工具(主要用于测试接口时候)

    添加的过程 安装完后,就可以在下图上,看到一个poster 点击poster就可以看到下图 图中红线圈好的,是必须要填写的 Url是访问路径 Name是参数名称 Value是参数值 需要注意一点的是: ...

  5. Unity3D ——强大的跨平台3D游戏开发工具(二)

    第二章 Unity3D的简单预览 每个Unity3D版本都会自带一个Demo源文件.在3.0的正式版中,自带的Demo就是网上展示的那款强大的射击游戏.在一般情况下,您只要第一次 打开Unity3D ...

  6. VS2013 opencv2.4.8

    [转]http://my.phirobot.com/blog/2014-02-opencv_configuration_in_vs.html vs2010+opencv2.4.0:http://www ...

  7. sql2000数据库误删除后自行恢复二次覆盖成功恢复

    sql2000数据库误删除后自行恢复二次覆盖成功恢复 [数据恢复故障描述] 今天接到一个客户电话,他的速达sql2000数据库,数据库误删除了,关键之前还没有备份过.他就想自己尝试恢复,使用网上下载的 ...

  8. 递归添加 另一个ds 里的DataRow 时 报错:该行已经属于另一个表。

    public void create_tree(DataSet ds, int parentid)        { DataSet newds = new DataSet();            ...

  9. UVa 336 - A Node Too Far

    题目大意:在计算机网络中,每条信息都有一个TTL值,在信息到达一个节点时,TTL值首先减1,如果TTL为0,则丢弃该信息报文.给一个网络的配置,给定源点和TTL值,判断该网络中有多少节点不可到达. 无 ...

  10. UVa 507 - Jill Rides Again

    题目大意:最大和子序列问题.由于具有最大和的子序列具有一下性质:第一项不为负数,并且从第一项开始累加,中间不会有和出现负数,因为一旦有负数我们可以抛弃前边的部分以得到更大的子序列和,这将会产生矛盾. ...