当我们选中网页上的文字时，通常的效果是蓝底白字，其实，底色和字体颜色是可以改变的。
我们可以使用伪元素来实现这种效果：
首字下沉，是否似曾相识呢？哦，是在以前学 word 软件文字排版的时候。在一些报纸上经常都会看见首字下沉的效果，其他文字围绕在它周围。
看上去还是这么回事。
通过锚点，我们可以滚动到网页特定的位置，原始的锚点跳转是没有过渡效果的。注意滚动条：
通过 CSS scroll-behavior 属性可以让滚动变得更加丝滑。
caret-color 属性可以让我们自定义 input 框闪烁的光标，是不是很神奇鸭
给透明背景图片加背景，感觉很厉害的样子。两行 CSS 样式九搞定咯：
我们可以修改滚动条的样式，滚动条变得更加炫酷。
如果你不想让用户选中页面上的文字，就可以用这个特性了。
很多情况下都需要应用到IE盒子模型的特性，让元素的宽度、高度包含border和padding。
1.写具体数值，如line-height:30px,则继承该值
2.写比例，如2或者1.5，则继承该比例
3.写百分比，如200%，则继承计算出来的值（考点：重点是先计算后继承，所以继承的是父节点的计算结果而不是和比例一样是计算的当前节点的结果）
如
我们知道html中元素对外表现都是一个个盒子或者说是框，那么这些盒子是否都一样呢？前面说过，这些盒子有的是从上到下竖着摆放的，而有的是横着摆放的。另外，有的盒子装的内容是直接展示的，有的却是魔术盒，根据标签和属性决定具体的展示内容。
替换元素是指，浏览器会根据元素的标签和属性，来决定元素的具体显示内容。 其内容不受CSS视觉格式化模型控制，CSS渲染模型并不考虑对此内容的渲染，且元素本身一般拥有固有尺寸（宽度，高度，宽高比）。
最明显的两个例子：
另外，textarea、select、object、video都是替换元素。这些元素往往没有实际的内容，即是一个空元素，浏览器会根据元素的标签类型和属性来显示这些元素。audio和canvas在某些特定情形下为替换元素。使用CSS的content属性插入的对象是匿名替换元素。
HTML 的大多数元素是非替换元素，浏览器直接将其内容显示出来。例如：div, p, span
普通流中，块元素独占一行。例如：div，p，h1等。
普通流中，行内元素左右可以有其他行内元素。
块级元素，width，height，margin，boder的设置遵循盒模型。
行内替换元素，width，height，margin，boder的设置遵循盒模型。另外，当其宽高有auto属性时，其表现如下：
css 行内元素 块元素 替换元素 非替换元素 以及这些元素的width height margin padding 特性
替换元素和非替换元素
html元素两种分类。替换元素和不可替换元素；块级元素和行内元素
置换元素(替换元素)和非置换元素(不可替换元素)
行内元素与块级元素的总结
置换和非置换元素
