CSS3知识汇总12

家中有长期卧床生病的孩子，还有要养的房和车，去年损失的钱使我备受打击。首次尝到了作为单身母亲的苦和痛。

去年底不仅买了之前说一辈子都不会碰的基金，还把所有买过的书籍全拿了出来，启动了新年挣钱计划。

春节放假正是看书的好时光，小说、名著、英语……都是我的最爱，但我还是舍弃了这些，选择了工具学习书。

今天看了张鑫旭的第二本书《CSS选择器世界》前三章，收获了不少知识点。总结如下：

css世界很简单，很多人（包括我自己）都认为，没什么好学的，这样的想法严重限制了开发者的技术提升。所以这本书买后放了很久，今天拿出来却很快地吸引了我。

css选择器非常强大，不仅涉及视觉表现，而且与用户安全、用户体验有非常密切的联系。

css选择器分为：选择器、选择符、伪类和伪元素

选择器：是平常使用css声明块前面的标签、类名等

选择符：后代关系的空格、父子关系的尖括号>、相邻兄弟关系的加号+、兄弟关系的弯弯~、列关系的双管道||

伪类，一个冒号，通常与浏览器行为和用户行为相关联，可以看成是CSS世界的javascript，可以实现纯CSS交互效果。

伪元素，两个冒号

如果要区分IE浏览器和其他浏览器，可使用：

/*IE*/

.example{}

/*其他浏览器*/

.example,  ::-webkit-whatever{}

对于一些需要特殊标记的元素，可以试试以短横线开头命名。

使用短命名，无须使用语义，只有HTML才重视语义。

与人合作，或之后的页面需要被其他人使用时，不要使用单命名。不举例了，你懂的。

要使用前缀，最好用项目名称的拼音首字母，最好不要超过4个字母，方便日后复制代码使用

命名不要使用拼音

对于组，可以用g；对于描述，可以用desc；盒子可用x；自定义弹框，可以用.open

不要使用ID选择器，不利于维护。

不要嵌套选择器，如.box .pic img

不要使用驼峰命名，这是javascript DOM的专用

样式重置可使用属性选择器和标签选择器

不要偷懒，养成在所有HTML标签上添加不会冲突的类名

如果设置列表第一个元素，可以使用伪类：

.cs-module-li:first-child{}

如果无须兼容IE8，也可以这样使用：

.cs-module-li:not(:first-child){}