css 块状元素与行内元素(内联元素)的理解
块状元素:
它一般是其他元素的容器元素,可以容纳块状元素和行内元素,它默认是不会和其他元素同一行的,即相当于两个块状元素写一起是垂直布局的。最常用的是div和p
行内元素:
行内元素又称内联元素,它只能够容纳文本及其他行内元素,常见的行内元素有 超链接,a, span ,img
行内元素与块状元素的差异是:行内元素并不会从新的一行开始,水平方向会一个个接着。
每个块状元素会从新的一行开始。
强调一下: display:block; float:left/right; 当css对行内元素定义这两属性中的一种之后,这些行内元素会具有块状元素属性!例如会从新的一行开始,就像后面跟了一个换行符一样,而且还具有了height和width属性。
如果要让块状元素变成内部元素只要用css加上display:inline就可以了
display:inline-block:
将对象呈递为内联对象,但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内,允许空格。
css 块状元素与行内元素(内联元素)的理解的更多相关文章
- 学习笔记——关于HTML(含HTML5)的块级元素和行级(内联)元素总结
		1.首先我们要知道什么是块级元素和行级(内联)元素? 块级(block)元素的特点: ①总是在新行上开始: ②高度,行高以及外边距和内边距都可控制: ③宽度缺省是它的容器的100%,除非设定一个宽度: ... 
- 关于HTML(含HTML5)的块级元素和行级(内联)元素总结
		1.首先我们要知道什么是块级元素和行级(内联)元素? 块级(block)元素的特点: ①总是在新行上开始: ②高度,行高以及外边距和内边距都可控制: ③宽度缺省是它的容器的100%,除非设定一个宽度: ... 
- CSS文档流与块级元素和内联元素(文档)
		CSS文档流与块级元素(block).内联元素(inline),之前翻阅不少书籍,看过不 少文章, 看到所多的是零碎的CSS布局基本知识,比较表面.看过O'Reilly的<CSS权威指 南> ... 
- 【css】主要的块状元素(block element)和内联元素(inline element行内元素)
		内联元素:只在行内发生作用,设置宽高不起作用,不会影响文字内容,使其换行等.竖直方向和间距也不起作用 display可以强制转换行内元素和块状元素,还可以取消显示none 块元素(bloc ... 
- css布局中关于 块状元素和行内元素的区分
		这两天在准备实习的面试和笔试,准备复习一下这些基础的概念,避免自己处于一种仅脑袋理解嘴巴不能表述出来的状态. 块状元素和行内元素的概念是在css页面布局这个地方出现.主要是将html标签按照一定的特性 ... 
- Css中的两个重要概念:块状元素和内联元素
		一.display:block display:block就是将元素显示为块级元素,一般是其他元素的容器,可容纳内联元素和其他块状元素,块状元素排斥其他元素与其位于同一行,宽度(width)高度(he ... 
- CSS 块状元素和内联元素的详解
		我们先来分析一下块级元素.内联级元素的定义和解析: 块元素(block element)一般是其他元素的容器元素,块元素一般都从新行开始,它可以容纳内联元素和其他块元素,常见块元素是段落标签'P&q ... 
- css 内联元素inline 行框全解
		首先看一篇文章: CSS框模型:一切皆为框 — 从行框说起 一 行框 看图说话 上图代表了框模型中的行框.line-height 属性设置行间的距离(行高).该属性会影响行框的布局.在应用到一个块级元 ... 
- 【CSS3】---块状元素、内联元素(又叫行内元素)和内联块状元素
		元素分类 在CSS中,html中的标签元素大体被分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1&g ... 
随机推荐
- .NET Core单文件发布静态编译AOT CoreRT
			.NET Core单文件发布静态编译AOT CoreRT,将.NET Core应用打包成一个可执行文件并包含运行时. 支持Windows, MacOS and Linux x64 w/ RyuJIT ... 
- [转载]MySQL运行状态show status详解
			要查看MySQL运行状态,要优化MySQL运行效率都少不了要运行show status查看各种状态,下面是参考官方文档及网上资料整理出来的中文详细解释,不管你是初学mysql还是你是mysql专业级的 ... 
- Swagger的简单入门【转载】
			一.Swagger简介 上一篇文章中我们介绍了Spring Boot对Restful的支持,这篇文章我们继续讨论这个话题,不过,我们这里不再讨论Restful API如何实现,而是讨论Restful ... 
- spring使用之旅(二) ---- AOP的使用
			什么是AOP? AOP基本概念 AOP使用--注解方式 AOP使用--XML方式 实例--日志 写在最前面的(源码地址): https://github.com/xc83415134/spring_a ... 
- poj 3294
			Life Forms Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 12688 Accepted: 3552 Descr ... 
- [hdu3943]K-th Nya Number
			挺正常的一道模板题. f[i][j][k]表示i位的数,有j个4,k个7的方案数. 具体实现的话...我写了发二分答案..需要注意的是二分时应该是mid=L+(R-L)/2..不然分分钟爆longlo ... 
- ubuntu开启openssh-server,ssh[xshell]
			在虚机中安装了ubuntu,但是从宿主机器上ping 22的端口始终不通,查询原因,虚机只安装了 openssh-client. 运行Terminal $-> sudo apt-get inst ... 
- MFC获取可执行文件(exe)所在文件目录
			可以应用函数GetModuleFileName(),举一个例子: CString strexe; ::GetModuleFileName(NULL,strexe.GetBufferSetLength( ... 
- Redis进阶实践之五Redis的高级特性
			一.引言 上一篇文章写了Redis的特征,使用场景,同时也介绍了Redis的基本数据类型,redis的数据类型是操作redis的基础,这个必须好好的掌握.今天我们开始介绍一些Redis的高级特性 ... 
- 刚装上最新node,npm install报这个错误!求ndoe大神解答!!!
			npm -v和node-v都可以打印出来但是 npm install就报错! 解决方法:网络问题,建议使用cnpm install命令安装npm,再运行npm run dev 命令 
