<>

a标签的四个动态伪类

a标签的动态伪类有四个，分别是：

:link :visited :hove :active（不要漏掉前面的冒号）

语法就是

要注意四个属性是有优先级的，从高到低依次是：link > visited > hover > active

红色只有没点击时才能显示出来，只要点击过一次就是visited，并且刷新页面也不能编回红色，所以如果你想点击不变色，就要把link 和 visited设置的颜色一样

5个伪元素

伪元素有五个，分别是：

::before

::after

::first-line

::first-letter

::selection（这里是双冒号，注意和伪类的区分）

before after语法

before是把内容加到.div1 内容的前面；after是把内容加到.div1 内容的后面；并且只能使用一次，使用多次后面会覆盖前面的效果。

content里面可以填写文字，如果没有文字就如上面的那样直接放入空元素，不能不写。

然后就可以加上css样式，和普通的样式书写一样

::first-line、 ::first- letter、 ::selection语法

首先看一下我没加这三条语句是的效果




字体是红色的，选中区的颜色和字体颜色大家可以看一下，等下做个对比



然后输入这三段代码





运行一下,结果如下





这样就很明显看出

::first-line是改变第一行字体的样式

::first-letter是改变第一个字符的样式

::selection是改变选中区的背景颜色和字体颜色

不过这里有一个bug就是::seletion 和 ::first-letter的兼容性，当用了::first-letter时，首字符就不能被选中了，只有当去掉::first-letter时，才可以

通过伪元素去除浮动

平时我们再给父级清浮动，可以加“overflow：hidden”、给父级加高度、给浮动标签加“clear：both”，如果一个页面用了很多浮动，那么我们就要清除很多次，既浪费时间还增加了冗余代码，如果用伪元素就可以很好的解决这些问题
我们可以定义一个类选择器.clearfix



一般浏览器只用前三行就可以，后面三行是针对ie6、7、8这种低版本的浏览器

在要清浮动的标签里这样写，就可以直接调用了