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. BZOJ 2209: [Jsoi2011]括号序列 [splay 括号]

    2209: [Jsoi2011]括号序列 Time Limit: 20 Sec  Memory Limit: 259 MBSubmit: 1111  Solved: 541[Submit][Statu ...

  2. Android线程之异步消息处理机制（二）——Message、Handler、MessageQueue和Looper

    异步消息处理机制解析 Android中的异步消息处理主要有四个部分组成,Message.Handler.MessageQueue和Looper. 1.Message Message是在线程之间传递的消 ...

  3. X-001 FriendlyARM Tiny4412 uboot移植前奏

    版权声明:本文为博主原创文章,转载请注明出处 开发环境:win7 64位 + VMware12 + Ubuntu14.04 64位 工具链:linaro提供的gcc-linaro-6.1.1-2016 ...

  4. UVa 324 - Factorial Frequencies

    题目大意:给一个数n,统计n的阶乘中各个数字出现的次数.用java的大数做. import java.io.*; import java.util.*; import java.math.*; cla ...

  5. Python中下划线---完全解读

    Python 用下划线作为变量前缀和后缀指定特殊变量 _xxx 不能用'from module import *'导入 __xxx__ 系统定义名字 __xxx 类中的私有变量名 核心风格:避免用下划 ...

  6. JQuery的 jQuery.fn.extend() 和jQuery.extend();

    原文链接:http://caibaojian.com/jquery-extend-and-jquery-fn-extend.html jQuery.fn.extend(); jQuery.extend ...

  7. IOS开发中Xcode常用插件安装与管理（转）

    XCode中插件管理工具:Alcatraz    转自http://www.cocoachina.com/industry/20140506/8325.html 苹果现在的成绩得益于其始终如一的坚持. ...

  8. Yii实现Password Repeat Validate Rule

    在使用Yii时遇到这样的需求:在一个注册的页面输入两次密码,并验证两次输入是否一致.可是password的repeat的字段在数据库 并不存在.问题来了,如何创建一个password_repeat的属 ...

  9. C# .NET修改注册表

    c#修改注册表,需要引用Microsoft.Win32命名空间 using Microsoft.Win32; //声明 ///引用 RegistryKey reg; reg = Registry.Cl ...

  10. UVa 299 - Train Swapping

    题目大意:给n个数的一个序列,通过交换相邻的两个数使得这n个数按照从小到大的顺序排列. Inversion index problem: count how many swaps are needed ...