伪元素的妙用（闲着也是闲着）

伪元素其实就是用css基于某个DOM节点创造一个文档中本来没有的元素，它和其他基本元素一样可以有内容和样式并影响到布局，但因为并不真实存在于DOM中，故加了个伪字。记得第一次接触伪元素是学习清除浮动的时候。
清除浮动影响最基本的方式是对浮动元素之后的第一个元素加样式：clear：both/left/right；或者看情况在父元素设置overflow：hidden；或者粗暴地在后面加个空元素清除浮动。
后来发现原来前辈们最普遍的做法是将这句样式放在伪元素：after中
XX：after{
content：“.”;
display：block；
height：0px;
clear:both;}
除此之外，伪元素可以成为某些hack的策略，比如之前在stackoverflow看到有人问可以可以单纯用css来实现列表中list-style-disc等的换色。一般我们都是用小图标的，但是有人给出的解决方案是：
ul{list-style:none;padding:0;margin:0;}
ul li{
padding-left:1em;text-indent:-.7em;
}
ul li:before{content:'.'.color:red;}