CSS综合小练习

时间：2023-02-01 03:12:53

CSS选择器学了不少了，现在来实战一下。

CSS综合小练习

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>练习</title>
    <style type="text/css">

        .content {
            width: 800px;
            margin: 0 auto;
        }

        .content h1 {
            font-family: "Microsoft YaHei UI";
            font-size: 28px;
            text-align: center;
        }

        .content .box {
            text-align: center;
        }

        .time, .news {
            font-size: 14px;
        }

        .time {
            color: rgb(190, 190, 190);
        }

        .news {
            color: #990000;
        }

        /*属性选择器*/
        .box input[type=text] {
            color: red;
        }

        .box input[type=button] {
            font-weight;
            color: green;
        }

        .content p {
            text-indent: 2em;
            line-height: 24px;
        }

        .content p span {
            color: blue;
        }

    </style>
</head>
<body>
    <div class="content">
        <h1>中乙队赛前突然换帅仍胜毅腾 高原黑马欲阻击舜天</h1>
        <div class="box">
            <span class="time">2014年07月16日20:11</span>
            <span class="news">新浪体育 评论中大奖（11人参与）</span>
            <a href="#">收藏本文</a>&nbsp;
            <input type="text" value="请输入查询条件">&nbsp;
            <input type="button" value="搜索">
        </div>
        <hr />

        <p>新浪体育讯　7月16日是燕京啤酒<span>[微博]</span>
            2014中国足协杯第三轮比赛，丽江嘉云昊队主场迎战哈尔滨毅腾队的比赛日。
            然而就在比赛日中午，丽江嘉云昊队主帅李虎和另外两名成员悄然向俱乐部提出了辞呈，
            并且收拾行囊准备离开。在这样的情况下，
            丽江嘉云昊队不得不由此前的教练员杨贵东代理指挥了本场比赛。</p>

        <p>在昨日丽江嘉云昊队主帅李虎就缺席了赛前的新闻发布会，
            当时俱乐部给出的解释是李虎由于身体欠佳，
            去医院接受治疗。然而今日李虎出现在俱乐部时，
            向记者否认了这一说法，并且坦言已经向俱乐部提出了辞呈。</p>

        <p>据记者多方了解的情况，李虎<span>[微博]</span>
            极其教练组近来在执教成绩上承受了不小的压力，
            在联赛间歇期期间，教练组曾向俱乐部提出能够多引进有实力的球员补强球队，
            然而由于和俱乐部在投入以及成绩指标上的分歧，李虎最终和教练组一起在比赛日辞职。</p>

        <p>这样的情况并没有影响到丽江嘉云昊队<span>[微博]</span>的队员，
            在比赛中丽江队在主场拼的非常凶，在暴雨之中仍然发挥出了体能充沛的优势，
            最终凭借点球击败了中超球队哈尔滨毅腾，顺利晋级下一轮比赛。
            <strong>根据中国足协杯的赛程，丽江嘉云昊队将在本月23日迎战江苏舜天队。</strong></p>
    </div>

</body>
</html>

写CSS比较有意思的是，写好了CSS看效果，有种焕然一新的感觉，原来毫无生气的页面，瞬间变得整齐，规矩。

相关文章