CSS中最常用的个人认为是链接方式，即外部连接。通常刚学习的小白，容易忘记在头部中加link标签，比如我，我用的时候，容易忘记写，所以，在使用外部连接方式时一定先把link标签写上。
html源代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>模仿SOSO搜搜</title>
<link rel="stylesheet" href="Example2.css">
</head>
<body>
<div id="big">
<!--1.图片-->
<div align="center"><img src="img/SOSO.jpg" alt="" ></div>
<!--2.连接-->
<div class="div">
<ul>
<li id="h"></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>
<li><a href="#">问问</a></li>
<li><a href="#">团购</a></li>
<li><a href="#">新闻</a></li>
<li><a href="#">地图</a></li>
<li id="more"><a href="#">更多>></a></li>
</ul>
<p style="height: 44px"> </p>
</div>
<!--3.表单-->
<div id="s">
<form action="#" id="flg" name="flg">
<input type="text" value="">
<input type="submit" value="搜搜">
</form>
</div>
</div>
</body>
</html>
源代码
*{
margin: 0;
padding: 0;
}
p{
margin: 0;
padding: 0;
}
#div{
margin: 0 auto;
font-size: 12px;
padding: 0;
border-bottom: 1px solid #00c;
background: #EEE;
width: 800px;
height: 18px;
}
div li a{
display: block;
text-decoration: underline;
padding: 4px 0 0 0;
margin: 0;
font-size: 13px;
}
div li{
float: left;
list-style-type: none;
margin: 0;
padding: 0;
width: 40px;
}
div li a:link,div li a:visited{
color: #004276;
}
div li#h{
width: 400px;
height: 18px;
}
#s{
background-color: #006eb8;
width: 430px;
height: 40px;
margin: 0 auto;
}
form{
display: block;
padding-left: 120px;
padding-top: 15px;
}
#big{
width: 1200px;
}
