<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title >广州商学院</title>
<base href="http://www.gzcc.cn/">
<link rel="stylesheet"type="text/css"href="test1.css">
<style type="text/css">
p{
color: black;
}
h2{
background-color: blue;
}
.textyellow{
color:green;
}
#aa{
color: red;
}
</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>
</nav>
<p style="color: red;margin-left: 20px;">校园新闻</p>
<p>校园新闻</p>
<h3 id="2015">2015</h3>
<script>
document.write(Date())
document.getElementById("2015").innerHTML="";
</script>
<br>
<div id="container" style="width: 400px ">
<div id="header" style="background-color:blue"><h2 align="center" style="margin-bottom: 0;">用户登录</h2></div>
<div id="content" style="background-color:#EEEEEE;height: 180px;width: 400px;float: left;text-align:center;">
<form >
用户名:<input type="text" name="username"placeholder="请输入用户名"><br><br>
密码:<input type="Password" name="passname"placeholde=""><br><br>
<input type="radio" value="student">学生
<input type="radio" value="teacher">教师 <br>
<input type="button" value="登录" >
<input type="button" value="重置">
</form>
</div>
<div id="footer" style="background-color:blue;clear:both;text-align:center;">版权 ? 广州商学院</div>
<br><br>
<h2>通知</h2>
<p id="aa">广州商学院即将举办校运会放假3天！</p>
<p >当天是双十一！</p>
<p class="textyellow">购物车又要满了！！</p>
<div>广州商学院即将举办校运会<span style="background-color: red;font-family: ‘Helvetica Neue‘, Helvetica, Arial, sans-serif;font-size: 50px;color: black">放假3天！</span></div>
</body>
</html>
原文：http://www.cnblogs.com/suxihong/p/7680840.html