CSS中的相关概念
CSS的几个概念:
包括块:一个元素的“布局上下文”。对于正常的HTML文本流中的一个元素,包括块由近期的块级祖先框、表单元格或行内块祖先框的内容边界(content
edge)构成。
考虑例如以下标记
<body>
<div>
<p>This is a paragraph.</p>
</div>
</body>
p元素的包括块是div元素,由于作为块元素、表单元格或行内块元素,这是近期的祖先元素。类似地div的包括块是body。
非替换元素:假设元素的内容包括在文档中,则称为替换元素。比如:假设一个段落的文本内容都放在该元素本省内。这个段落就是非替换元素。
替换元素:这是指作为其它内容占位符的一个元素。替换元素的一个经典样例就是img元素。它仅仅是指向一个图像文件。这个文件将被插入到文档流中该img元素本身所在的位置。大多数表单元素也能够替换(比如<input
type="radio">)。
块级元素:指段落、标题或div之类的元素。这些元素在正常流中时。会在其框和框主键生成‘换行“,所以处于正常流中的块级元素会垂直摆放。
通过声明display:block。能够让元素生成块级框。
行内元素:这是指strong或span之类的元素。这些元素不会在之前或之后生成”行分隔符“,他们是块级元素的后代。通过声明display:inline。能够让元素生成一个行内框。
根元素:位于文档树顶端的元素。在HTML文档中,就是HTML元素。
CSS中的相关概念的更多相关文章
- css中的线及vertical-align
行内元素格式化顺序: 相关概念: leading(行间距):指填充在两行文字间的铅条,等于line-height 和 font-size之差,其中一半leading加到文字上方,另一半leading ...
- css中的浮动与三种清除浮动的方法
说到浮动之前,先说一下CSS中margin属性的两种特殊现象 1, 外边距的合并现象: 如果两个div上下排序,给上面一个div设置margin-bottom,给下面一个div设置margin-top ...
- 对CSS中的Position、Float属性的一些深入探讨
对CSS中的Position.Float属性的一些深入探讨 对于Position.Float我们在平时使用上可以说是使用频率非常高的两个CSS属性,对于这两个属性的使用上面可能大多数人存在一些模糊与不 ...
- 总结一下CSS中的定位 Position 属性
在CSS中,Position 属性经常会用到,主要是绝对定位和相对定位,简单的使用都没有问题,尤其嵌套起来,就会有些混乱,今记录总结一下,防止久而忘之. CSS position 属性值: absol ...
- 浅析CSS中的BFC和IFC
1. 为什么会有BFC和IFC 首先要先了解两个概念:Box和formatting context: Box:CSS渲染的时候是以Box作为渲染的基本单位.Box的类型由元素的类型和display属性 ...
- CSS中一些常见的兼容性问题
CSS中一些兼容性问题就是浏览器兼容,而这些浏览器兼容问题主要是Ie和FF之间的争斗. CSS hack中的一些事: 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样 ...
- CSS中清除浮动的两种方式
在CSS中,父元素中的子元素如果使用了float,会导致父元素塌陷,高度为0. 对于这种情况,常见的解决方式有两种. 一.增加新的div,应用clear:both属性 html: <div cl ...
- CSS 中关于background 属性功能
background 是 css中的核心属性,我们对他应该充分了解. background-image 定义背景图像 这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...
- css中的负边距
css中的负边距(negative margin)是布局中的一个常用技巧,只要运用得合理常常会有意想不到的效果.很多特殊的css布局方法都依赖于负边距,所以掌握它的用法对于前端的同学来说,那是必须的. ...
随机推荐
- 洛谷 1063 dp 区间dp
洛谷 1063 dp 区间dp 感觉做完这道提高组T1的题之后,受到了深深的碾压,,最近各种不在状态.. 初看这道题,不难发现它具有区间可并性,即(i, j)的最大值可以由(i, k) 与 (k+1, ...
- PatentTips - Cross-domain data transfer using deferred page remapping
BACKGROUND OF THE INVENTION The present invention relates to data transfer across domains, and more ...
- Java并发编程(七)ConcurrentLinkedQueue的实现原理和源码分析
相关文章 Java并发编程(一)线程定义.状态和属性 Java并发编程(二)同步 Java并发编程(三)volatile域 Java并发编程(四)Java内存模型 Java并发编程(五)Concurr ...
- QQ在线人数统计图数据解析
转载请注明出处:http://blog.csdn.net/xiaoy_h/article/details/27980851 我相信非常多人一定去过这个地方: http://im.qq.com/onli ...
- python写个简单的文件上传是有多难,要么那么复杂,要么各种,,,老子来写个简单的
def upload(url,params): ''' 上传文件到server,不适合大文件 @params url 你懂的 @params {"action":"xxx ...
- ThinkPHP5.0最最最最最简单实例
ThinkPHP5.0最最最最最简单实例 一.效果图 二.操作步骤 1.用mysql数据库建立数据库 2.按照ThinkPHP官网的指示装好ThinkPHP5.0 tp5里面的目录结构如下: 3.配置 ...
- 开发者了解NET的15个特性
NET 开发者了解的15个特性 本文列举了 15 个值得了解的 C# 特性,旨在让 .NET 开发人员更好的使用 C# 语言进行开发工作. ObsoleteAttribute ObsoleteAttr ...
- CentOS7系统安装完MySQL后启动MySQL提示无服务
重新安装MariaDB数据库即可解决,MySQL所有命令可通用 MariaDB MariaDB数据库管理系统是MySQL的一个分支,主要由开源社区在维护,开发这个分支的原因之一是:甲骨文公司收购了My ...
- mysql实战45讲读书笔记(二) 一条SQL更新语句是如何执行的 极客时间
前面我们系统了解了一个查询语句的执行流程,并介绍了执行过程中涉及的处理模块.相信你还记得,一条查询语句的执行过程一般是经过连接器.分析器.优化器.执行器等功能模块,最后到达存储引擎. 那么,一条更新语 ...
- css文字换行问题white-space:pre-line或者white-space:pre-wrap,解决word-wrap:break-word解决不了的
想让文字换行必须要写的那几个css样式就略过了.当一行文字是数字或字母时或者数字字母组合时会出现不换行局面,这时候加个word-wrap:break-word:就基本可以解决但是有种情况是它解决不了的 ...