• CSS伪类



    :hover -- CSS :hover 伪类,适用于光标(鼠标指针)指向一个元素,但此元素未被激活时的样式

    • 语法: :hover
    • CSS版本号:CSS2
    • 引用网址:http://www.dreamdu.com/css/pseudo-class_hover/
    • 说明:
      • 适用于光标(鼠标指针)指向一个元素。但此元素未被激活时
      • client(浏览器)能够依据用户与其交互的动作改变其渲染效果,CSS为这样的情况提供了三个伪类:hoveractivefocus
      • 上述三种伪类不是相互排斥的,一个元素同一时候能够适用当中的若干个
      • :hover伪类。适用于当用户指向一个元素时,比如用户的鼠标指向一个段落p。当用户鼠标离开元素时,恢复元素原有的样式显示
    • hover。中文"停留、悬停"的意思

    语法

    :hover
    a:hover
    a.class:hover
    

    演示样例

    a:hover 
    {
    	color:yellow;
    	background:blue;
    	font-size:small;
    }
    p:hover
    {
    	color:yellow;
    	background:blue;
    	font-size:large;
    }
    div:hover
    {
    	color:red;
    	background:lime;
    	font-size:small;
    }
    


    IE浏览器不支持A元素以外的其他元素的:hover伪类

    IE6、IE7(Q)、IE8(Q)浏览器不支持A元素以外的其他元素的:hover伪类,可通过上面的演示样例測试

    伪类选择符的顺序:L-V-H-A

    CSS提供了四种伪类设置链接的颜色,包含:link、:visited、:hover、:active,它们的声明是有一定顺序的,我们将这样的顺序简称为L-V-H-A,即link最先,其次visited。之后hover。最后active,如此声明才干保证hover与active状态显示正确的样式

    演示样例

    a:link
    {
    	color: red;
    }
    a:visited
    {
    	color: green;
    }
    a:hover
    {
    	color: blue;
    }
    a:active
    {
    	color: black;
    }
    

    版权声明:本文博主原创文章,博客,未经同意不得转载。

  • 相关阅读:
    nginx自定义header支持
    使用 navicat 导入导出数据库
    eureka 服务注册与发现
    反射应用之动态代理
    接口应用之“静态代理”
    工厂模式
    计算程序运行的时间(以求得1-10000之间的素数为例)
    抽象类的模板方法设计模式
    ==和equals()方法的区别
    单例设计模式之饿汉式和懒汉式的区别
  • 原文地址:https://www.cnblogs.com/bhlsheji/p/4906910.html
Copyright © 2020-2023  润新知