代码提交，请帮忙看下是否正确需要优化

来源：2-10 编程练习

qq_happy

2019-04-25 11:03:36

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        /*此处写代码*/

        body {
            margin: 0;
            padding: 0;
            background: #add8e6;
            /*            color: #fff;*/
            font-size: 20px;
        }

        a {
            text-decoration: none;
            color: #333;
        }

        ul {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .header {
            height: 100px;
            background: #000;
            position: fixed;
            top: 0;
            width: 100%;
        }

        .nav-list {
            float: right
        }

        .nav-list li {
            display: inline-block;
            line-height: 100px;
            padding: 0 20px;
        }

        .nav-list li a {
            color: #fff;
        }

        .footer {
            position: fixed;
            width: 100%;
            bottom: 0;
            background: #000;
            text-align: center;
        }

        .footer .nav-list {
            float: inherit;
        }

        .content {
            padding-top: 100px;
            padding-bottom: 100px;
            overflow: hidden;
        }

        .container {
            width: 1200px;
            margin: 0 auto;
        }

        .title {
            font-weight: normal;
        }

        .leftbar {
            width: 50%;
            float: left;
        }

        .rightbar {
            width: 50%;
            float: right;
        }

        .list-left li {
            padding: 10px 0;
        }

        .list-left li a span {
            background-color: #ff9999;
            margin-right: 5px;
        }

        .list-right li {
            display: inline-block;
            padding: 10px 10px 10px 0;
        }

    </style>
</head>

<body>
    <!-- 此处写代码 -->
    <div class="header">
        <img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png" class="logo">
        <ul class="nav-list">
            <li><a href="#">课程</a></li>
            <li><a href="#">职业路径</a></li>
            <li><a href="#">实战</a></li>
            <li><a href="#">猿问</a></li>
            <li><a href="#">手记</a></li>
        </ul>
    </div>
    <div class="content">
        <div class="container">
            <div class="leftbar">
                <h3 class="title">课程推荐</h3>
                <ul class="list-left">
                    <li><a href="#"><span>职业路径</span> HTML5与CSS3实现动态网页</a></li>
                    <li><a href="#"><span>职业路径</span> 零基础入门Android语法与界面</a></li>
                    <li><a href="#"><span>职业路径</span> iOS基础语法与常用空间</a></li>
                    <li><a href="#"><span>职业路径</span> php入门开发</a></li>
                    <li><a href="#"><span>职业路径</span> JAVA入门开发</a></li>
                </ul>
            </div>
            <div class="rightbar">
                <h3 class="title">相关课程</h3>
                <ul class="list-right">
                    <li><a href="#">HTML</a></li>
                    <li><a href="#">css</a></li>
                    <li><a href="#">JavaScript</a></li>
                    <br>
                    <li><a href="#">HTML5</a></li>
                    <li><a href="#">css3</a></li>
                    <li><a href="#">Jquery</a></li>
                    <br>
                    <li><a href="#">移动端基础</a></li>
                    <li><a href="#">移动端APP开发</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="footer">
        <ul class="nav-list">
            <li><a href="#">网站首页</a></li>
            <li><a href="#">企业合作</a></li>
            <li><a href="#">人才招聘</a></li>
            <li><a href="#">联系我们</a></li>
            <li><a href="#">常见问题</a></li>
            <li><a href="#">友情链接</a></li>
        </ul>
    </div>
</body>

</html>

写回答

1回答