CSS选择器

常用的CSS选择器大家都熟悉，但是说到属性选择器，一些伪类选择器，伪元素未必每个人都会用，现在微软已经停止支持IE11以前的IE浏览器了，不考虑兼容问题的话，用CSS3新增的选择器还是挺方便的，例如:last-child,:not这些。看了几篇文章,详细学习了所有的CSS选择器,大部分都写demo尝试了一遍，也体验了emmet强大的语法，例如想生成下面的html代码，输入ul>li[class=num$]{number $}*10后按下Tab键就搞定,其他emmet的用法可以看官方文档。

1
2
3
4
5
6
7
8
9
10
11
12
<ul>
    <li class="num1">number 1</li>
    <li class="num2">number 2</li>
    <li class="num3">number 3</li>
    <li class="num4">number 4</li>
    <li class="num5">number 5</li>
    <li class="num6">number 6</li>
    <li class="num7">number 7</li>
    <li class="num8">number 8</li>
    <li class="num9">number 9</li>
    <li class="num10">number 10</li>
</ul>

第2篇文章里的思维导图非常详细，可以拿来快速参考。