精通CSS version2笔记之⒈选择器
1.常用的选择器: ①元素选择器 指定希望应用样式的元素.比如:p {color:#fff;} ②后代选择器 寻找特定元素或者元素的后代. 比如:body p{color:#ccc;} 这个选择器和子选择器body>p的区别是:body>p是指body下作为子元素的所有节点P,而后代选择 是body下面所有的节点P,可以说子元素选择器是一种特殊的后代选择器。 ③类选择器 指定特定的类应用样式比如.a{color:#ccc;} 类选择器命名最好根据它用作什么而不是表现什么来命名。如果在文档中添加了许多不必要 的类,那么这可能是文档结 构不合理的信号。最好根据祖先选择器的后代选择器来选定。 比如 p+div{color:#00f;}就可以实现应用样式 ⑧属性选择器可以根据属性的值来寻找元素 比如acronym[title='practise']{bgc:blue;}寻找拥有title属性且值为practised元素应用样式 ps:为了避免样式过分混乱,尽量保持一般样式非常一般,特殊样式非常特殊 继承是指应用样式的元素的后代会继承样式的某些属性,可以通过设置父元素的一般样式来避免子元素标签的过分使用。 现在样式表最常见的是链接样式,这样方法比导入方法快,使用结构良好的单一CSS文件可以显著提高下载速度,但是可以根据实际情况,尽量使代码美观不混乱。 代码的结构设计(!important) 为了便于维护,最好将样式分块 1.一般样式 ⑴主体样式 ⑵reset样式 ⑶链接 ⑷标题 ⑸其他元素 2.辅助样式 ⑴表单 ⑵通知和错误 ⑶一致的条目 3.页面结构 ⑴标题、页脚、导航 ⑵布局 ⑶其他页面结构元素 4.页面组件 各个页面 5.覆盖样式 在需要的地方加上注释是一种良好的习惯
|