block：多個元素豎直排列，每個元素單獨占一行，寬高可以設置，padding、margin可以設置；

inline：多個元素占一行，一行放不下了，才轉入下一行，寬高不能設置，水平的padding、margin有效，豎直的無效；

inline-block:多個元素占一行，但是內部的寬度。margin和padding的都可以設置。

https://www.cnblogs.com/KeithWang/p/3139517.html

block,inline,inline-block区别的更多相关文章

  1. display：inline、block、inline-block 的区别

    一.块级元素 与  行级元素 要理解display:inline.block.inline-block的区别,需要先了解HTML中的块级(block)元素和行级(inline)元素的特点,行内元素也叫 ...

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

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

  3. HTML5 display:inline、block、inline-block的区别--备用

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  4. display:inline、block、inline-block的区别(转)

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  5. display:inline-block，block，inline的区别与用法

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  6. 2017-08-20 block，inline和inline-block概念和区别

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

  7. display:inline、block、inline-block区别

    display:inline.block.inline-block区别 display:block就是将元素显示为块级元素. display:inline就是将元素显示为行内元素. inline-bl ...

  8. display:inline、block、inline-block的区别（摘抄）

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

  9. display:inline、block、inline-block的区别 摘】

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  10. css菜鸟学习之block，inline和inline-block概念和区别

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

随机推荐

  1. Java开发笔记（五十八）简单接口及其实现

    前面介绍了抽象方法及抽象类的用法,看似解决了不确定行为的方法定义,既然叫唤动作允许声明为抽象方法,那么飞翔.游泳也能声明为抽象方法,并且鸡类涵盖的物种不够多,最好把这些行为动作扩展到鸟类这个群体,于是 ...

  2. Android开发过程中的坑及解决方法收录（三）

    bug:应用出现了 不幸运的,应用已停止的错误提示 排除问题: 1.intent接收数据的字符串不匹配 2.java常见的NullPointerException(空指针错误),可能由三个原因引起,字 ...

  3. 使用ArcGIS Earth矢量化高精度的数据(kml转图层转shp/要素类)

    大家好,这次来分享干货.做地理分析的同学,或者需要使用地图却不知道哪里有精度较高矢量数据(如校园图)的时候,怎么办呢? 我们知道ArcGIS提供了精度较高的全球影像图,基于此,可以自己进行矢量化,然后 ...

  4. windows10 企业版完整激活

    windows10 企业版完整激活 cmd管理员运行 1.  以管理员身份执行cmd命令,然后输入以下命令: slmgr.vbs /upk 由于Win10正式版允许在命令提示符界面使用"Ct ...

  5. linux 硬盘满了如何处理(转)

    linux 硬盘满了如何处理 事件源于在服务器运行一个脚本程序… 好好的脚本突然报错,还以为脚本出现问题了.细看报错原因(具体报错信息已经忘记了),是没有可用空间.从没遇见过这个情况,怎么办呢? 一. ...

  6. markdown小知识总结

    字体.字号.颜色 但如果我们想修改文字大小/颜色/字体,就要用font标签,代码如下: 宋体大小为2的字 color代表字体颜色(要用16进制颜色值),size代表文字大小,face代表字体 效果展示 ...

  7. 我的第一个python web开发框架（31）——定制ORM（七）

    几个复杂的ORM方式都已介绍完了,剩下一些常用的删除.获取记录数量.统计合计数.获取最大值.获取最小值等方法我就不一一详细介绍了,直接给出代码大家自行查看. #!/usr/bin/env python ...

  8. LivePhoto开发，你要知道的知识点

    前言 Apple从iPhone6s开始支持Live Photo.Live Photo 会录下拍照前后 1.5 秒所发生的一切,因此用户获得的不仅仅是一张精美照片,还有拍照前后时刻的动作和声音.具体的操 ...

  9. Java11新特性！

    Java11又出新版本了,我还在Java8上停着.不过这也挡不住我对他的热爱,忍不住查看了一下他的新性能,由于自己知识有限,只总结了以下八个特性: 1.本地变量类型推断 什么是局部变量类型推断? va ...

  10. win 10 Hbuilder1.2.1连接Genymotion 调试Android 软件

    这里记录一下 Hbuilder1.2.1连接Genymotion 调试Android 软件 的过程: 步骤一:把Genymotion 的 adb.exe 路径配置到 Hbuilder 中 在 菜单栏 ...