<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>導(dǎo)航</title>
<style type ="text/css">
*{
margin:0;
padding:0;
}
.nav{
list-style:none;
width:1000px;
background-color:red;
margin:100px auto;
overflow:hidden;
}
.nav li{
float:left;
width:20%;
}
.nav a{
display:block;
text-align:center;
padding:5px 0;
text-decoration:none;
font-weight:bold;
color:white;
}
.nav a:hover{
background-color:black;
}
</style>
</head>
<body>
<ul class="nav">
<li><a href="#">首頁(yè)</a></li>
<li><a href="#">娛樂</a></li>
<li><a href="#">社會(huì)</a></li>
<li><a href="#">生活</a></li>
<li><a href="#">奇聞</a></li>
</ul>
</body>
</html>
image.png
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>表格</title>
<style type="text/css">
*{
padding:0;
margin:0;
}
.q{
height:80px;
width:1133px;
background-color:white;
border:gold 2px solid;
margin:50px auto;
}
.w{
width:120px;
height:60px;
float:left;
font-size:25px;
font-weight:bold;
font-family:"微軟雅黑";
color:pink;
text-align:center;
padding:10px 20px;
}
.e{
width:120px;
height:60px;
float:left;
border-left:2px gold solid;
border-right:2px gold solid;
font-size:25px;
font-weight:bold;
font-family:"微軟雅黑";
color:pink;
text-align:center;
padding:10px 20px;
}
.r{
width:120px;
height:60px;
float:left;
border-right:1px gold solid;
font-size:25px;
font-family:"微軟雅黑";
font-weight:bold;
color:pink;
padding:10px 20px;
}
.t{
width:120px;
height:60px;
float:left;
border-left:1px gold solid;
border-right:1px gold solid;
font-size:25px;
font-weight:bold;
font-family:"微軟雅黑";
color:pink;
text-align:center;
padding:10px 20px;
}
.y{
width:120px;
height:60px;
float:left;
border-left:1px gold solid;
border-right:1px gold solid;
font-size:25px;
font-weight:bold;
font-family:"微軟雅黑";
color:pink;
text-align:center;
padding:10px 20px;
}
.u{
width:120px;
height:60px;
float:left;
border-left:1px gold solid;
border-right:1px gold solid;
font-size:25px;
font-weight:bold;
font-family:"微軟雅黑";
color:pink;
text-align:center;
padding:10px 20px;
}
.i{
width:120px;
height:60px;
float:left;
border-left:1px gold solid;
font-size:25px;
font-weight:bold;
font-family:"微軟雅黑";
color:pink;
text-align:center;
padding:10px 20px;
}
</style>
</head>
<body>
<div class="q">
<div class="w">首頁(yè)</div>
<div class="e">公司簡(jiǎn)介</div>
<div class="r">解決方案</div>
<div class="t">公司新聞</div>
<div class="y">行業(yè)動(dòng)態(tài)</div>
<div class="u">招賢納才</div>
<div class="i">聯(lián)系我們</div></div>
</body>
</html>
image.png
...
