请老师检查谢谢

来源：2-2 编程练习

慕UI4313976

2020-02-29 10:51:36

LOGO左边的标题是专门对齐的吗？
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>index</title>
    <link rel="stylesheet" href="../css/index.css">
</head>
<body>
    <header>
        <div class="container">
            <a href="#">
                <img src="http://climg.mukewang.com/582e5f160001b17100400040.png">
                <div>MYMOOC</div>
            </a>
            <nav>
                <a class="Home active" href="#">Home</a>
                <a class="Course" href="#">Course</a>
                <a class="Actual" href="#">Actual</a>
                <a class="Plan" href="#">Plan</a>
                <a class="FAQ" href="#">FAQ</a>
                <a class="Notes" href="#">Notes</a>
            </nav>
        </div>
        
    </header>
</body>
</html>
------------------------
*{
    margin: 0;
    padding: 0;
    border: 0;
}
a{text-decoration: none;}

img{display: block;}
header{
    height: 70px;
    background: black;
}
header > .container{
    width: 1200px;
    margin: 0 auto;
}
header > .container > a{
    display: block;
    float: left;
    margin: 15px 25px;
}

header > .container > a > img{
    float: left;
}

header > .container > a > div{
    float: left;
    font-size: 24px;
    color: white;
    margin-top: 12px;
}

header > .container > nav{
    float: right;
    height: 70px;
    margin: 0 25px;
}

header > .container > nav > a{
    display: block;
    float: left;
    height: 65px;
    line-height: 65px;
    font-size: 24px;
    width: 100px;
    text-align: center;
    color: white;
}
header > .container > nav > a.Home{background: #d40112;}
header > .container > nav > a.Course{background: #feb800;}
header > .container > nav > a.Actual{background: #78b917;}
header > .container > nav > a.Plan{background: #433b90;}
header > .container > nav > a.FAQ{background: #f27c01;}
header > .container > nav > a.Notes{background: #017fcb;}
header > .container > nav > a:hover,
header > .container > nav > a.active{
    padding-bottom: 5px;
}

写回答

1回答