Html学习之十一（CSS选择器的应用一） 

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>网业设计软件列表</title>
        <style>
            body{font-family: "微软雅黑";
                text-align: center;
                font-size: 16px;
                line-height: 32px;
                }
            hr{width: 750px;size:3px;}
            a{text-decoration: none;
                color: black;
                padding-right: 15px;
                font-size: 22px;
                }
            a:hover{color: red;
                    text-decoration: underline;
                    }
            ul{list-style-type: none;}
            li:before{
                content:url(img/11.png)
                }
            li:nth-child(even){color: greenyellow;}
            li:nth-child(1) strong{color: red;}
            li:nth-child(2) strong{color: chocolate;}
        </style>
    </head>
    <body>
        <header>
            <h1>网页设计软件列表（单机查看）</h1>
        </header>
        <nav>
            <hr>
            <a href="#">Photoshop软件</a>
            <a href="#">Illustrator软件</a>
            <a href="#">Dreamweaver软件</a>
            <a href="#">Fireworks软件</a>
            <hr>
        </nav>
        <div>
            <img src="img/1.jpg" alt="">
            <ul>
                <li>Photoshop一款好到违反广告法的超<strong>S级设计神器</strong>！给画面来点动感吧。</li>
                <li>Photoshop处理以<strong>像素构成的图像</strong>，可以有效地进行图片编辑调整工作。</li>
                <li>Photoshop有很多功能，在图像、图形、文字、出版等各方面都有涉及。</li>
                <li>在制作建筑效果图包括许三维场景时，常常需要在Photoshop进行调整。</li>
            </ul>
        </div>
    </body>
</html>

结果：

 

posted @ 2019-03-30 23:23  泰初  阅读(327)  评论(0)  编辑  收藏  举报