<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<button class="btn-link add-line-comment js-add-line-comment js-add-split-line-comment" data-type="addition" data-path="慕课前端练习/CSS网页布局基础/2-4.html" data-anchor="diff-3ed2dc48e602dd86babf679810da051b" data-position="5" data-original-line="+ <meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>2-4</title>
<style type="text/css">
/*清除默认边距*/
* {
padding: 0;
margin: 0;
}
/*整个导航的样式*/
.nav {
background: black;
width: 1100px;
height: 100px;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto auto;
}
/*导航列表样式*/
.list ul {
position: absolute;
right: 0;
top: 0;
list-style: none;
}
.list ul li {
float: left;
line-height: 100px;
text-align: center;
margin-right: 70px;
}
/*超链接样式*/
a:link {
color: white;
}
a:visited {
color: cornflowerblue;
}
a {
text-decoration: none;
}
/*log样式*/
.log {
position: absolute;
left: 0;
top: 0;
}
/*鼠标指针样式*/
.log, li {
cursor: pointer;
}
</style>
</head>
<body>
<div class="nav">
<div class="log"><a href="#"><img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png" alt=""></a></div>
<div class="list">
<ul>
<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>
</body>
</html>
- 1 回答
- 0 关注
- 1596 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消