导航，头部，CSS基础
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>欢迎登陆</title>
<base href="http:www.gzcc.cn/"target="_blank">
<link rel="stylesheet"type="text/css"href="color.css">
<style type="text/css">
p1{
color:red
}
hi{
color:blue;
}
</style>
</head>
<body>
<nav>
<img src="http://www.gzcc.cn/2016/images/banner.png"><br>
<a href="">首页</a>
<a href="">新闻</a>
<input type="text"name="search">
<button type="submit">搜索</button>
<a href="">登陆</a>
<a href="">注册</a>
<a href="">退出</a>
</nav>
<div>
<p>校园活动<span style="font-family: 'Consolas', 'Deja Vu Sans Mono', 'Bitstream Vera Sans Mono', monospace; font-size: 50px;background-color: #FFD700">精选</span></p>
<p1> 浏览后请退出账号!</p1><br>
<hi>浏览后请退出账号!</hi>
</div>
</div>
<div id="container" style="width:400px " >
<div id="header" style="background-color:lightblue;"><h2 align="center" style="margin-bottom:0;">欢迎登录</h2></div>
<div id="content" style="background-color:lightblue;height:150px;width:400px;float:left;">
<form>
username:<input type="text"name="mingzi"placeholder="请输入用户名"><br>
password:<input type="password"name="mima"placeholder="请输入密码"><br>
student<input type="radio"name="role"value="student" >
teacher<input type="radio"name="role"value="teacher" ><br>
<input type="button"value="login">
<input type="button"value="cancel">
</form>
</div>
<div id="footer" style="background-color:lightblue;clear:both;text-align:center;">版权 © duym</div>
<div id="answer" style="width:400px " ></div>
<div id="title" style="background-color:pink;"><h2 align="center" style="margin-bottom:0;">搜索</h2></div>
<div id="search" style="background-color:pink;height:350px;width:400px;float:left;">
<form>
<select>
<option>问答</option>
<option>收藏</option>
</select>
</form>
<ul>
<li>课表管理</li>
<li>学籍管理</li>
<li>教材管理</li>
<li>教学简报</li>
</ul>
<ol>
<li>校历</li>
<li>专业课表</li>
<li>教务系统</li>
</ol>
<dl>
<dt><a href="http://lib.gzcc.cn/">图书馆</a> </dt>
<dd><a href="http://oa.gzcc.cn/index.php?m=content&c=index&a=lists&catid=2333">本馆概况</a></dd>
<dd><a href="http://lib.gzcc.cn/html/gaikuang/guanshelveying/">馆舍掠影</a></dd>
</dl>
</div></div>
</body>
</html>
a1{
color:purple;
}
a2{
background-color:yellow;
}
a3{
color:red;
}
a4{
color:orange;
}
