1、代表内联样式,如: style=””,权值为1000。
2、代表ID选择器,如:#content,权值为100。
3、代表类,伪类和属性选择器,如.content,权值为10。
4、代表类型(元素)选择器和伪元素选择器,如div p,权值为1。
按照CSS代码的执行先后顺序。如果有重复的规则,按照后执行的定义。最终规则是多个定义规则的综合。重点:高级规则定义对于不同表格的文字样式定义。(不同表格使用不同ID、使用类样式定义)一页中的多种超级链接样式定义。多个相同规则不同对象的CSS共同定义。对于同一对象定义的多种CSS方式考虑哪种更科学。
开篇一句话:CSS的伪类,伪元素就当成vue的过滤器使用就好了,我也是想到这个突然就茅塞顿开了。
用法:
:after 选择器表示向选定的元素之后插入内容。
要有content属性
需求举例:div按钮后面有个朝下的ico,点击div后 ico方向朝上
实现办法:
1.可以使用JS实现,div的class名绑定到一个变量上,根据变量的真假值更换class
2.伪类的实现方法
先说思路:
要借助两个class,基础class('base_class')和激活class('rotate').
base_class
相对定位。
base_class:after
放ico朝上的样式,绝对定位。
rotate不要单独加after,不然会取代掉base_class的after,
要两个class都出现才加after
rotate绑定到一个布尔变量上,该变量的真假值由open_select_window更改
html:
:before是css中的一种伪元素,可用于在某个元素之前插入某些内容。:after是css中的一种伪元素,可用于在某个元素之后插入某些内容。
可以看下这个简单的例子:http://www.runoob.com/try/try.php?filename=trycss_sel_after