css基础——2017.2.21

css伪类

:link  伪类将应用于未被访问过的链接。IE6不兼容,解决此问题,直接使用a标签

:hover 伪类将应用于有鼠标指针悬停于其上的元素。在IE6只能应用于a链接,IE7+所有元素都兼容。

:active  伪类将应用于被激活的元素,如被点击的链接、被按下的按钮等。

:vistited  伪类将应用于已经被访问过的链接

:focus  伪类将应用于拥有键盘输入焦点的元素


a:link { color: red; }

a:vistited { color: purple; }

a:hover { color: white; }

a:active { color: yellow; }

顺序问题:love hate原则


css伪元素

:first-line

:first-letter

以上两个伪元素只能用于块级元素


:first-child  选择属于第一个子元素的元素

如  span:first-child{} /*选择属于第一子元素的所有span标签*/


:before与:after伪元素,可以设置元素之前之后的内容,并且配合content设置相关内容

:wrap:before,.wrap:after { content: "-------";  display: block;/*让当前伪元素变为块级元素*/}


css层叠性

css继承性(子承父业)

所有字相关的可以继承,比如color、text-系列、font-系列、line-系列、cursor

并不是所有的css属性都可以继承,如下面的属性就不具有继承性:边框、外边框、内边距、背景、定位、元素宽高属性

所有盒子相关的属性都不能继承


css的优先级

层叠性是指:在样式的优先级相同的情况下才会考虑的

行内样式、id选择器、类选择器、标签选择器


继承的样式要大于默认的样式

通配符选择器样式的优先级比继承样式的优先级高

标签的选择器的优先级要高于通配符选择器的优先级

类选择器的样式优先级要高于标签的选择器的优先级

id选择器的样式优先级要高于类选择器的优先级

行内样式优先级高于id选择器的优先级

你可能感兴趣的:(css基础——2017.2.21)