n CSS浮动和清除
1、CSS浮动
l 浮动的元素将向左或向右浮动，浮动到包围元素的边上，或上一个浮动元素的边上为止
l 浮动的元素，不再占空间了，并且浮动元素的层级要高于普通元素。
l 浮动的元素，一定是“块元素”。不管它原来是什么元素。
l 如果浮动元素，没有指定宽度的话，浮动后它将尽可能的变窄。因此，浮动元素一般要定宽和高。
l 一行中的多个元素，要浮动一起浮动，要不浮动都不浮动
浮动元素的功能：可以实现将多个块元素并列显示。
1、 CSS浮动清除
需要在浮动元素的下边，使用清除浮动操作。 clear:both | left | right;
或在父元素使用。 overflow: hidden;
n CSS继承性
CSS属性继承：外层元素的样式，会被内层元素进行继承。多个外层元素的样式，最终都会“叠加”到内层元素上。
CSS文本属性都会被继承的：color、font-size、font-family、font-style、font-weight、text-align、text-decoration、text-indent、letter-spacing、line-height等
提示：<body>中的CSS属性会被所有的子元素继承
n CSS优先级
（1） 单个选择器的优先级
行内样式>id选择器>class选择器>标签选择器
（2） 多个选择器的优先级
多个选择器的优先级，一般情况下，指向越准确，优先级越高。
n display属性
n overflow属性：当内容溢出时，该如何显示
n cursor光标类型
cursor：网页中光标的类型，取值：text（文本）、help（帮助）、pointer（手形）等。
n CSS定位
定位方式，要与定位属性配合使用
n 固定定位，position:fixed
l 固定定位，是相对于浏览器窗口来进行的定位。
l 固定定位，不占空间，层级要高于普通元素。它不会随着网页的滚动而滚动。
l 如果不指定定位的坐标的话，固定定位元素的位置在原地不动。
l 固定定位元素，一定是“块元素”，不管原来它是什么元素。
n 相对定位，position:relative;
l 相对定位，是相对于“原来的自己”进行定位。
l 相对定位，依然占空间，层级高于普通元素。
l 如果不指定定位坐标的话，相对定位元素的位置在原地不动。
l 相对定位，原来是行内元素，定位后还是行内元素；原来是块元素，定位后还是块元素。
提示：相对定位和绝对定位，一般情况下是配合使用的。
n 绝对定位，position:absolute;
l 相对于祖先定位元素（相对定位），来进行定位。
u 如果它的父元素没有进行任何定位的话，再往上找定位元素。
u 如果一直找到<body>都没有找到定位元素的话，那就相对于<body>来进行定位。
l 绝对定位元素，不占空间，层级要高于普通元素。
l 如果不指定定位坐标的话，绝对定位元素的位置在原地不动。.
l 绝对定位元素，一定是“块元素”，不管原来它是什么元素。
l 多个定位图片层叠时：
n HTML引入CSS的方法
1、嵌入式
通过<style>标记，来引入CSS样式。
语法格式：<style type=”text/css”></style>
提示：<style>中的CSS样式，只能给当前网页使用。
同一个网页中，<style>标记可以多次使用。
2、外联式
通过<link>标记，来引入一个外部的CSS文件（.css），这样的话，可以实现公共的CSS代码被多个网页共享
<link rel=”stylesheet” type=”text/css” href=”css/public.css”>
<link>标记的常用属性
l rel：也就是引入的是什么类型的文件，取值：stylesheet。
l type：内容类型。
l href：引入的CSS文件地址。
提示：<link>标记放在<head>标记中。
同一个网页中，可以使用多个<link>来链入多个外部文件。
2、 行内式（主要用于js控制元素的样式）
每一个HTML标记，都有一些公共的属性：class、id、title（鼠标放上有一个提示信息）、style。
HTML标记中的style属性的值，与CSS中样式一模一样。
行内样式的优先级最高，比ID选择器还要高。
n CSS表格属性
Border-collapse：表格边框线合并，取值：collapse
n 盒子模型
我们可以把每一个HTML标记，都看成是一个“盒子”。
“盒子”特征：内容的高度或高度、边框线、内填充、外边距。
“盒子”的总宽度：内容的宽度+边框宽度*2+左填充*2+左外边距*2
n 上下外边距合并问题——这是一种现象
上下两个块元素，如果每一个元素都指定了四个外边距，那么上下相邻的那个外边距会发生合并的现象，合并后取其中较大的外边距。
要实现上下两个<div>之间的距离为100px，该如何实现呢？
1、 上下两个<div>其中一个只指定margin-bottom:100px，而另外一个<div>的margin-top:0px，这样可以实现。
2、 可以在上下两个<div>中间，添加一个空的<div>，并且给空<div>指定高度为100px，也可以实现。
如对本文有疑问， 点击进行留言回复！！
深入理解CSS background-blend-mode的作用机制
我要评论
网友评论