• 技术文章 >web前端 >前端问答

    css hover怎么设置

    藏色散人藏色散人2021-04-29 14:04:16原创724

    css hover是一种用于选择鼠标指针浮动在上面的元素的选择器,该选择器的设置语法如“a:hover{background-color:yellow;}”。

    本文操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。

    :hover 选择器用于选择鼠标指针浮动在上面的元素。

    提示::hover 选择器可用于所有元素,不只是链接。

    提示::link 选择器设置指向未被访问页面的链接的样式,:visited 选择器用于设置指向已被访问的页面的链接,:active 选择器用于活动链接。

    注释:在 CSS 定义中,:hover 必须位于 :link 和 :visited 之后(如果存在的话),这样样式才能生效。

    实例

    选择鼠标指针浮动在其上的元素,并设置其样式:

    代码:

    <!DOCTYPE html>
    <html>
    <head>
    <style>
    a:hover
    {
    background-color:yellow;
    }
    </style>
    </head>
    <body>
    
    <a href="http://www.w3school.com.cn">W3Sschool</a>
    <a href="http://www.google.com">Google</a>
    <a href="http://www.wikipedia.org">Wikipedia</a>
    
    <p><b>注释:</b>:hover 选择器鼠标指针在其上浮动的链接设置样式。</p>
    
    </body>
    </html>

    效果:

    a64dc61dfed4a66f314f90efa64bf12.png

    更多详细的HTML/CSS知识,请访问CSS视频教程栏目!

    以上就是css hover怎么设置的详细内容,更多请关注php中文网其它相关文章!

    声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。
    专题推荐:css hover
    上一篇:css无法显示图片怎么办 下一篇:html什么时候出的
    PHP编程就业班

    相关文章推荐

    • 如何让css hover 失效• hover在css中有什么用?• css a hover 不变色怎么办• hover不起作用怎么办• css hover失效怎么办

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网