伪类

Demo

b7d867e860ae6b0f77b27dfcc550b977.png

代码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            /* a链接没有被访问过的状态 */
            a:link{
                color: orange;
            }
            /* a链接被访问过的状态 */
            a:visited{
                color: green;
            }
            /* 鼠标移动至a链接时的状态 */
            a:hover{
                color: red;
            }
            /* 鼠标按下 没有抬起时的状态 */
            a:active{
                color: yellow;
            }
            
            ul{
                margin: 0;
                padding: 0;
            }
            
            li{
                list-style: none;
                float: left;
                width: 160px;
                height: 60px;
                text-align: center;
                line-height: 60px;
                background-color: black;
                color: white;
            }
            .li1:hover{
                background-color: red;
            }
            
            .li2:hover{
                background-color: cadetblue;
            }
            
            .li3:hover{
                background-color: sandybrown;
            }
            
        </style>
        
        
    </head>
    <body>
        <!-- a标签的集中状态 -->
        <a href="https://baidu.com">百度</a>
        <ul>
            <li class="li1">实战</li>
            <li class="li2">课程</li>
            <li class="li3">社区</li>
        </ul>
    </body>
</html>
文章名: 《伪类》

本文链接:https://lula.fun/774.html

除特别注明外,文章均由 Neworld 原创

 原创文章 转载时请注明 出处 以及文章链接
最后修改:2019 年 05 月 13 日 05 : 18 PM

发表评论