- 制作自己的导航条。
- HTML头部元素：
- <base> 定义了页面链接标签的默认链接地址
- <style> 定义了HTML文档的样式
- <link> 定义了一个文档和外部资源之间的关系
- 练习样式表：
- 行内样式表
- 内嵌样式表
- 外部样式表
- 分别练习定义三类选择器：
- HTML 选择器
- CLASS 类选择器
- ID 选择器
<!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="171.css"> ???<style type="text/css">p { ???font-size: 20px; ???background-color: lightcyan;}#tt{color:#FFD700;}.x1{ ???color: red;}</style></head><body> <nav> ???????<a href="">官方首页</a> ????<a href="">校内咨询</a> ???????<a href="http://www.gzcc.cn/">下载APP</a> ???????<input type="text"name="search"> ???????<button type="submit">搜索</button> ???<a href="">返回</a> ???<a href="">注销</a> ???</nav><hr><h1 style="color:cyan ">广州商学院</h1><div id="container" style="width: 400px"> ???<div id="header" style=" line-height: 1.5 !important;">"><h2 align="center" style="margin-bottom: 0;">登录</h2></div><div id="content" style="bheight: 150px;width: 400px;float: left;"> ???<form action=""> ???????????<select> ?????????????<option>校内入口</option> ?????????????<option>校外入口</option> ?????????</select><br> ?????账号:<input type="text" name="账号"placeholder="请输入学号"><br> ???????????密码:<input type="password" name="密码"placeholder="请输入密码"> ???????????<br> ???????<input type="radio"name="role"value="stu">学生 ???????<input type="radio"name="vehicle"value="tea">教师<br> ???????????<input type="button" value="登录"> ???????????<input type="button" value="取消"> ???</form><div id="container" style="width: 400px"> ???<div id="header" style=" line-height: 1.5 !important;">"><h2 align="center" style="margin-bottom: 0;"></h2></div><div id="content" style="height: 150px;width: 400px;float: left;"> ???<form action=""> <p>交通指南</p> ???????<P class="x1">人才招聘</P> ???????<p id="tt">合作院校</p> </div> ???<div id="footer" style="clear: both;text-align: center;">版权。duym</div></div> <div> ???</div></body></html>p { ???font-size: 20px; ???background-color: lightcyan;}#tt{color:#FFD700;}.x1{font-size: 20px; ???border-color: orangered;}h1{background-color:cyan;}
导航，头部，CSS基础
原文地址：http://www.cnblogs.com/Carrie-chong/p/7691392.html