CSS: inline、block和inline-block的区别
block
块级元素特点:
1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(很霸道,一个块级元素独占一行)
2、元素的高度、宽度、行高以及顶和底边距都可设置。
3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。
inline
内联元素特点:
1、和其他元素都在一行上;
2、元素的高度、宽度及顶部和底部边距不可设置;
3、元素的宽度就是它包含的文字或图片的宽度,不可改变。
inline-block
内联块状元素(inline-block)就是同时具备内联元素、块状元素的特点。
inline-block 元素特点:
1、和其他元素都在一行上;
2、元素的高度、宽度、行高以及顶和底边距都可设置。
CSS: inline、block和inline-block的区别的更多相关文章
- css菜鸟学习之block,inline和inline-block概念和区别
block,inline和inline-block概念和区别 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) ...
- css(二) block,inline和inline-block概念和区别
转: http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-leve ...
- Css 中的 block,inline和inline-block概念和区别
1.block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通常被现 ...
- HTML/CSS:block,inline和inline-block概念和区别
总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...
- CSS中block,inline和block-inline的区别(转载)
http://www.cnblogs.com/KeithWang/p/3139517.html 总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level e ...
- 2017-08-20 block,inline和inline-block概念和区别
display:inline.block.inline-block的区别 display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都 ...
- block,inline,inline-block的区别
block: 英语翻译过来是“块”意思,就跟小时候玩过的积木方块一样,一块一块往上搭. inline: 英语翻译过来就是“内联”的意思,内联不好理解,我的理解就是行内元素: block和inline都 ...
- display:inline-block,block,inline的区别与用法
一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置 margi ...
- CSS——display(Block none inline等)属性的用法
在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例.图演示 ...
- CSS基础:block,inline和inline-block
css的display属性是前端开发中非常常见的属性,本文简单介绍下其中比较常用的属性值,即block.inline和inline-block. HTML组件中呈现一片空白区域的组件都可当盒模型(bo ...
随机推荐
- python 安装自己下载的whl依赖
下载好之后保存到相应的地方,如下载了xxxx.whl文件并将它保存在D:\python\project目录下,然后 pip install D:\python\project\xxxx.whl即可
- Docker Compose搭建Redis一主二从三哨兵高可用集群
一.Docker Compose介绍 https://docs.docker.com/compose/ Docker官方的网站是这样介绍Docker Compose的: Compose是用于定义和运行 ...
- React之拆分组件与组件之间的传值
父子组件传值: 父组件向子组件传值通过向子组件TodoItem进行属性绑定(content={item}.index={index}),代码如下 getTodoItem () { return thi ...
- Task.Run()方法总结
一.从异步方法的声明说起 无返回值的类型异步方法 (1)public async Task MethodName() 带返回值类型的异步方法 (2)public async Task<TResu ...
- jvm 内存结构
jvm 内存结构 graph TB A(jvm)-->E(类加载器系统) A-->B(运行时数据区) A-->D(本地库接口) A-->C(执行引擎) B-->虚拟机栈 ...
- SQL Server等待事件—PAGEIOLATCH_EX
什么是PAGEIOLATCH_EX等待事件? 下面我们将对PAGEIOLATCH_EX等待事件的相关资料做一个简单的归纳.整理.关于PAGEIOLATCH_EX,官方文档的简单介绍如下: PAGEIO ...
- 【57】目标检测之Anchor Boxes
Anchor Boxes 到目前为止,对象检测中存在的一个问题是每个格子只能检测出一个对象,如果你想让一个格子检测出多个对象,你可以这么做,就是使用anchor box这个概念. 我们还是先吃一颗栗子 ...
- python学习---文件修改
1.读一行,写一行,判断字符串,修改之. f=open("yesterday2","r",encoding="utf-8") f_new=o ...
- day18 正则表达式初学
正则规则:客观存在的,世界上任何一种语言都能使用它. 在线测试网址:http://tool.chinaz.com/regex 正则语句:只和字符串相关,需要考虑的是:在同一个位置上可以出现的字符范围 ...
- 并查集find,merge操作
一.find操作 //find操作路径压缩版 inline int find(int x){ if(fa[x]==x) return x; int t=find(fa[x]); fa[x]=t; re ...