block

块级元素特点:

1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(很霸道,一个块级元素独占一行)

2、元素的高度、宽度、行高以及顶和底边距都可设置。

3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。

inline

内联元素特点:

1、和其他元素都在一行上

2、元素的高度、宽度及顶部和底部边距不可设置;

3、元素的宽度就是它包含的文字或图片的宽度,不可改变。

inline-block

内联块状元素(inline-block)就是同时具备内联元素、块状元素的特点。

inline-block 元素特点:

1、和其他元素都在一行上

2、元素的高度、宽度、行高以及顶和底边距都可设置

CSS: inline、block和inline-block的区别的更多相关文章

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

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

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

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

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

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

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

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

  5. CSS中block,inline和block-inline的区别(转载)

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

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

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

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

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

  8. display:inline-block,block,inline的区别与用法

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

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

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

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

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

随机推荐

  1. 10个用于C#.NET开发的基本调试工具

    在调试软件时,工具非常重要.获取正确的工具,然后再调试时提起正确的信息.根据获取的正确的错误信息,可以找到问题的根源所在.找到问题根源所在,你就能够解决该错误了. 你将看到我认为最基本的解决在C# . ...

  2. pdf转图片(qq:2798641729)

    前面已经把html转成pdf,但是用户可以下载图片格式的文件,所以我们必须把pdf转成图片格式,代码如下 package com.jit.platform.basics.util.pdf; impor ...

  3. vscode自己常用的快捷键

    (1)快速复制一行 ctrl + alt +

  4. pikachu-跨站请求伪造(CSRF)

    一.CSRF漏洞概述 1.1 什么是CSRF漏洞 在CSRF的攻击场景中攻击者会伪造一个请求(整个请求一般是一个链接),然后七篇目标用户进行点击,用户一旦点击了这个请求,整个攻击也就完成了,所以CSR ...

  5. [Docker] 使用docker inspect查看宿主机与容器的共享目录

    docker inspect 容器名,可以查看到容器的元信息,在返回的j'son信息里面有个Mounts字段可以看到挂载目录 "Mounts": [ { "Type&qu ...

  6. java设计模式1——单例模式

    java设计模式1--单例模式 1.单例模式介绍 1.1.核心作用:保证一个类只有一个实例,并且提供一个访问该实例的全局访问点 1.2.常见场景 1.3.单例模式的优点 1.4.常见的五种单例模式实现 ...

  7. echarts gl 3d地图,click事件失效,解决办法

    问题 比如点击四川,进行下钻,需要获取点击区域的name属性,根据name进而异步获取四川的地图的json,如下图所示: echart和gl版本 Loaded claygl, version 1.2. ...

  8. android编译/反编译常用工具及项目依赖关系

    项目依赖关系 apktool:依赖smali/baksmali,XML部分 AXMLPrinter2 JEB:dx 工具依赖 AOSP , 反编译dex 依赖 apktool dex2jar:依赖 A ...

  9. Linux下使用VsCode进行Qt开发环境搭建

    最近在Linux上搞Qt, vim环境还用不太习惯, QtCreator之前使用时莫名其妙崩溃然后丢失代码之后就被我彻底放弃了, 于是研究了一下用VsCode进行Qt开发. 首先是系统环境和下载安装包 ...

  10. Java基础之五、Java编程思想(1-7)

    一.对象导论 1:多态的可互换对象 面向对象程序设计语言使用了后期绑定的概念. 当向对象发送消息时,被调用的代码直到运行时才能确定.也叫动态绑定. 2:单根继承结构 所有的类最终都继承自单一的基类,这 ...