1.制作自己的导航条。
2.HTML头部元素：
- <base> 定义了页面链接标签的默认链接地址
- <style> 定义了HTML文档的样式文件
- <link> 定义了一个文档和外部资源之间的关系
3.练习样式表：
- 行内样式表
- 内嵌样式表
- 外部样式表
4.分别练习定义三类选择器：
- HTML 选择器
- CLASS 类选择器
- ID 选择器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>管理信息系统</title> </head> <body> <style type="text/css"> p{ color:deepskyblue;size: 50px; } .textblue{ color:gold;size: 50px; } #zg{ color:red;size: 50px; } </style> <p id="zg">喜迎中共十九大！！！</p> <p>以优异的成绩迎接党的十九大胜利召开</p> <p class="textblue">砥砺奋进 继往开来 共筑中共梦</p> <nav> <a href="http://www.gzcc.cn/">首页</a> <a href="">下载</a> <input type="text" name="search"> <button type="submit">搜索</button> <a href="">登录</a> <a href="">注册</a> <a href="">意见反馈</a> </nav> <a href="http://www.gzcc.cn/">广州商学院 <br> <img src="http://www.gzcc.cn/2016/images/banner.png" width="500" height="39" alt="gzcc.cn"/></a> <hr> <div id="container" style=" 400px"> <div id="header" style="background-color: aquamarine"><h2 align="center" style="margin-bottom: 0;">登录页面</h2></div> <div id="content" style="background-color: yellow;height: 150px; 400px;float: left;"> <form action=""> 账 号:<input type="" name="账号" placeholder="请输入用户名"><br> 密 码:<input type="" name="密码" placeholder="请输入密码"><br> <br> <input type="radio"name="role" value="stu">学生 <input type="radio" name="role" value="tea">教师 <input type="radio" name="role" value="tea">游客<br> <input type="button" value="登录"> <input type="button" value="取消"> <input type="button" value="重置"> </form> </div> <div id="footer" style="background-color: aquamarine;clear: both;text-align: center;">版权 © duym</div> </div> <hr> <div id="container" style="400px"> <div id="header" style="background-color:aquamarine;"><h2 align="center" style="margin-bottom:0;">搜索页面</h2></div> <div id="contant" style="background-color:yellow;height:220px;400px;float:left;"> <form action=" "...></form> <form> <select > <option>学生</option> <option>教师</option> <option>游客</option> </select> </form> <ul> <li>学校简介</li> <li>大事记</li> <li>全景校园</li> </ul> <ol> <li>会计学院</li> <li>信息技术与工程学院</li> <li>旅游学院</li> </ol> <div id="footer" style="background-color:aquamarine;clear:both;text-align:center;">版权© duym</div> </body> </html>
css:
p{ color:deepskyblue; } .textblue{ color:gold; background-color: aqua; } #zg{ color:red; }
