【自动采集网站建设】示例代码如下:
input[type=”text”]:hover{ background: #6cf;} /+鼠标指针悬停的样式+/
input[type=”text'’】:focus{ background: #390;} 产获取焦点的样式+/
input[type=”text”]:active{ background: #999;) 产按下鼠标未松手的样式+/
应用此样式的代码如下:
<p>姓名:<input type=”text" name=”name”/></p>
<p>地址:<input type=”text" name=”address”/></p>
浏览器中的浏览效果如图6-16所示。
(a)页面初次加载 (b)鼠标指针悬停 (3)按下鼠标未松手 (d)获取{
图6-16 UI元素状态伪类选择符的浏览效果
需要注意的是,active样式要写在focus样式后面,否则不会生效。因为浏览者按下鼠标未松手( active)的时刻其实也是获取焦点(focus)的时刻,所以,如果把focus样式写到active样式后面,就会重写样式。
6.4多重样式表的层叠
前面介绍了在网页中插入样式表的4种方法,如果这4种方法同时出现,浏览器会以哪种方法定义的规则为准?这涉及样式表的优先级和叠加。一般原则是,最接近目标的样式定义优先级最高。高优先级样式将继承低优先级样式的未重叠定义,但覆盖重叠的定义。根据规定,样式表的优先级别从高到低为:行内样式表、内部样式表、链入的外部样式表、导入的外部样式表和默认浏览器样式表。浏览器将按照上述顺序执行样式表的规则。
样式表的层叠性就是继承性,样式表的继承规则是:外部的元素样式会保留下来,由这个元素所包含的其他元素继承;所有在元素中嵌套的元素都会继承外层元素指定的属性值,有时会把多层嵌套的样式叠加在一起,除非进行更改;遇到冲突的地方,以最后定义的为准。
本文地址:
http://www.yishenzhou.com/yes/post/382.html | 分类:企业网站设计 |
次阅读