当前博客:选择器的讲解:8.伪类选择器

267 次浏览【转载需注明来源】


常用的伪类选择器如下:

:鼠标移入    :disbaled (不可使用)    :focus(聚焦)     :empty(空的)

不常用的

a:link 未访问过的 样式

a:visited 访问过的 样式

:active 当鼠标左键按下时,被激活的样式

 

 

:鼠标移入

	<样式>
		区块{
		    宽度: 100px;
		    高度: 100px;
		    背景-颜色: 颜色值-青色;
		}
		区块:鼠标移入{
		    背景-颜色: 颜色值-粉色;
		}
		</样式>
	</网页头部>
	<网页主体>
		<!--这里编写网页代码-->
		<区块></区块>
	</网页主体>
Markup

 

未移入:                                                                       

           

移入:                            

 

 

看下常用的示例及效果

<!文档类型 网页类型>
<网页 语言代码="中文">
	<网页头部>
		<网页信息 文档编码="UTF8" />
		<网页信息 名称="页面视图" 关联数据="视图宽度=填充视图宽度,初始缩放值=1,最大缩放值=1,用户缩放状态=假" />
		<网页信息 关联HTTP="兼容模式" 关联数据="最高IE版本" />
		<网页标题>选择器的讲解</网页标题>
		<样式>
		区块{
		    宽度: 100px;
		    高度: 100px;
		    背景-颜色: 颜色值-青色;
		}
		区块:鼠标移入{
		    背景-颜色: 颜色值-粉色;
		}
		数据框:disabled{
		    /*匹配不可用的表单元素*/
		    边框: 5px 实线 颜色值-粉色;
		}
		数据框:focus{
		    /*匹配聚焦的表单元素*/
		    边框: 5px 实线 颜色值-金色;
		}
		段落:empty{
		    /*可以匹配空文本的标签*/
		    宽度: 50px;
		    高度: 50px;
		    背景-颜色:颜色值-矢车菊蓝色;
		}
		</样式>
	</网页头部>
	<网页主体>
		<!--这里编写网页代码-->
		<区块></区块>
		<数据框 数据类型="文本输入" 禁用数据框>
        <数据框 数据类型="文本输入" >
        <数据框 数据类型="文本输入" 获得焦点>
        <段落></段落>
	</网页主体>
</网页>


Markup

以上就是本系列文章的全部内容,感谢观看,捧场的点个赞,谢谢兄弟们

 

选择器的讲解:8.伪类选择器