麻烦老师纠错，非常感谢！

来源：3-3 编程练习

bao_

2020-01-28 20:48:00

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
        * {
            margin: 0px;
            padding: 0px;
        }

        body {
            min-width: 800px;
            font-family: "宋体";
        }

        .header,
        .footer {
            width: 100%;
            height: 100px;
            line-height: 100px;
            float: left;
            background: #000000;
            color: white;
        }

        .content {
            padding: 0 220px 0 260px;
        }

        .left,
        .middle,
        .right {
            float: left;
            min-height: 600px;
            position: relative;
        }

        .middle {
            width: 100%;
            background: pink;
        }

        .left {
            width: 260px;
            background: #FFCC99;
            margin-left: -100%;
            left: -260px;
        }

        .right {
            width: 220px;
            background: #99CCFF;
            margin-left: -220px;
            right: -220px;
        }

        .nav_list ul,
        .footer ul {
            list-style: none;
        }

        .nav_list ul li,
        .footer ul li {
            display: inline-block;
            margin: 0 30px;
            cursor: pointer;
        }

        .nav_list ul li {
            float: right;
        }

        .footer ul {
            text-align: center;
        }

        .header img {
            width: 300px;
            float: left;
            cursor: pointer;
        }

        .middle {
            text-align: center;
        }

        .content img {
            width: 450px;
            height: 350px;
            margin-top: 80px;
        }

        h3,
        p {
            line-height: 30px;
            margin-left: 15px;
            font-size: 12px;
        }

        span {
            font-size: 12px;
            background: #FF6699;
            margin-right: 5px;
            color: black;
        }

        .left_content {
            margin-top: 80px;
        }

        .right_content {
            margin-top: 80px;
        }

        .input_text,
        .input_password {
            width: 160px;
            height: 40px;
            line-height: 30px;
            background: white;
            border-radius: 3px;
            cursor: text;
            margin: 10px 25px;
            border: none
        }

        .login_btn {
            width: 160px;
            height: 45px;
            border-radius: 3px;
            background: red;
            color: white;
            border: none;
            margin-left: 25px;
        }
    </style>
</head>

<body>
    <div class="header">
        <img src="http://img1.sycdn.imooc.com\/climg/58c0d2d900016ce303000100.png" />
        <div class="nav_list">
            <ul>
                <li>课程</li>
                <li>职业路径</li>
                <li>实战</li>
                <li>猿问</li>
                <li>手记</li>
            </ul>
        </div>
    </div>
    <div class="content">
        <div class="middle">
            <img src="http://img1.sycdn.imooc.com\/climg/590037e00001fab706000400.jpg" />
        </div>
        <div class="left">
            <div class="left_content">
                <h3 style="font-size:18px;">课程推荐</h3>
                <p><span>职业路径</span>HTML和CSS3实现动态网页</p>
                <p><span>职业路径</span>零基础入门Android语法</p>
                <p><span>职业路径</span>IOS基础语法与常用控件</p>
                <p><span>职业路径</span>PHP入门开发</p>
                <p><span>职业路径</span>JAVA入门开发</p>
            </div>
        </div>
        <div class="right">
            <div class="right_content">
                <h3 style="font-size:18px; margin-left:25px">登录</h3>
                <input type="text" name="text" class="input_text" placeholder="请输入登陆邮箱/手机号" />
                <input type="password" name="password" class="input_password" placeholder="请输入6-16位密码" />
                <input type="button" name="btn" class="login_btn" value="登录" />
            </div>
        </div>
    </div>
    <div class="footer">
        <ul>
            <li>网站首页</li>
            <li>企业合作</li>
            <li>人才招聘</li>
            <li>联系我们</li>
            <li>常见问题</li>
            <li>友情链接</li>
        </ul>
    </div>
</body>

</html>

还有登录的按钮,怎么感觉不出来有点击的感觉呢

写回答

1回答