display:block

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

    block元素可以设置width,height属性。块级元素即使设置了宽度,仍然是独占一行。

    block元素可以设置margin和padding属性。

display:inline

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

    inline元素设置width,height属性无效。

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

display:inline-block

    简单来说就是将对象呈现为inline对象,但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。比如我们可以给一个link(a元素)inline-block属性值,使其既具有block的宽度高度特性又具有inline的同行特性。

CSS--block inline inline-block的更多相关文章

  1. css中inline、block、inline-block的区别

    http://www.cnblogs.com/fxair/archive/2012/07/05/2577280.html display:inline就是将元素显示为块级元素. block元素的特点是 ...

  2. css学习--inline-block详解及dispaly:inline inline-block block 三者区别精要概括

    *知识储备: 内联元素:是不可以控制宽和高.margin等:并且在同一行显示,不换行. 块级元素:是可以控制宽和高.margin等,并且会换行. 1.inline-block 详解 (1)一句话就是在 ...

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

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

  4. CSS基础:block,inline和inline-block

    css的display属性是前端开发中非常常见的属性,本文简单介绍下其中比较常用的属性值,即block.inline和inline-block. HTML组件中呈现一片空白区域的组件都可当盒模型(bo ...

  5. css display block 和 inline

    根据CSS规范的规定,每一个网页元素都有一个display属性,用于确定该元素的类型,每一个元素都有默认的display属性值,比如div元素,它的默认display属性值为“block”,成为“块级 ...

  6. CSS 概念 Block Inline Containing block

    Block 元素 包括 "block-level box," "block container box," and "block box" ...

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

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

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

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

  9. css菜鸟学习之block,inline和inline-block概念和区别

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

  10. HTML/CSS:block,inline和inline-block概念和区别

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

随机推荐

  1. JS变量类型与计算

    一.题目 1.JS中使用typeof能得到哪些类型? 2.何时使用===何时使用==? 3.JS中有哪些内置函数? 4.JS变量按照存储方式区分为哪些类型,并描述其特点? 5.如何理解JSON? 知识 ...

  2. MATLAB程序控制语句

    Matlab中的程序控制语句包括条件控制(Conditional Control).循环(Loop Control).异常处理(Error Control)和程序返回(Program Terminat ...

  3. 利用RALL机制来事项String类的赋值操作

    class String{ public: char *str; String(const char *ptr=NULL){ if(ptr==NULL) { str=NULL; }else{ str= ...

  4. 数据迁移时 提示 No changes detected

    1.删除数据库中django_migrations 中对应的信息 2.删除app下的migrations对应的文件 3.重新执行就可成功 如不成功 ,直接删库 ,重新迁移

  5. [React Native] change port when running react native

    Two ways to do that. First, use this module to do that, https://github.com/ktonon/react-native-port- ...

  6. 关于表格table嵌套,边框合并问题的解决方法,table嵌套(转)

    原文地址:http://www.cnblogs.com/zhangym118/archive/2016/05/16/5496931.html [问题] 外层table与内层table嵌套,内外表格都需 ...

  7. 【转】2、Jenkins构建完成自动发送邮件

    1.开通163邮箱的授权码服务,和SMTP服务.百度找教程.2.安装 Email Extension Plugin 插件,已安装或版本自带可跳过此步骤.3.进入系统管理–系统设置首先配置 Jenkin ...

  8. BeyondCompare使用一段时间后会因“许可证密钥已被撤销:3281-0350“而无法使用

    解决方式: 1.用任意文本编辑软件打开“C:\Users\[Your User Name]\AppData\Roaming\Scooter Software\Beyond Compare 3\BCSt ...

  9. Instrumentation接口详解

    Instrumentation接口位于jdk1.6包java.lang.instrument包下,Instrumentation指的是可以独立于应用程序之外的代理程序,可以用来监控和扩展JVM上运行的 ...

  10. spring-boot集成activiti的model遇到问题汇总

    按照网上的七拼八凑整合网页版的部署将遇到的问题归置如下: 本人的springboot版本是:1.5.13.RELEASE 工作流相关: <!--工作流--> <dependency& ...