1、制作自己的导航条。
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>简书</title> ???<link rel="stylesheet" href="1018.css"></head><body><nav> ???<img src="https://p1.ssl.qhmsg.com/dr/270_500_/t01745b3fd4078d5a9e.jpg?size=512x512" height="50" width="50"> ???<a href="http://www.jianshu.com/"></a> ???<input type="text" name="search"> ???<button type="submit">搜索</button> ???<a href="https://www.jianshu.com/sign_in">登陆</a> ???<a href="https://www.jianshu.com/sign_up">注册</a></nav>
2、HTML头部元素：
<base> 定义了页面链接标签的默认链接地址
<base href="" target="_blank">
<style> 定义了HTML文档的样式
???<style type="text/css"> ???????p{ ???????????color: red; ???????} ???</style><link> 定义了一个文档和外部资源之间的关系
<head> ???<meta charset="UTF-8"> ???<title>简书</title> ???<link rel="stylesheet" href="1018.css"></head>
3 练习样式表：
行内样式表
内嵌样式表
外部样式表
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>简书</title> ???<link rel="stylesheet" type="text/css" href="1018.css"> ???<style type="text/css"> ?????p{ ?????color: red; ???} ?????.zidingyi{ ????????color: blue; ???} ???#commentcount{ ?????????background-color: aquamarine; ???} ???</style></head><body><nav> ???<img src="https://p1.ssl.qhmsg.com/dr/270_500_/t01745b3fd4078d5a9e.jpg?size=512x512" height="50" width="50"> ???<a href="http://www.jianshu.com/"></a> ???<input type="text" name="search"> ???<button type="submit">搜索</button> ???<a href="https://www.jianshu.com/sign_in">登陆</a> ???<a href="https://www.jianshu.com/sign_up">注册</a></nav><p>十九大 <span style="background: black;font-size: 30px;font-family: 微软雅黑">召开</span></p><p>十九大召开</p><p>十九大召开</p><p>十九大召开</p><h1 class="zidingyi">评论</h1><h2><span id="commentcount" >1000</span>点赞</h2></body></html>4、分别练习定义三类选择器：
- HTML 选择器
- CLASS 类选择器
- ID 选择器
{# ???????1 ?.HTML 选择器#} ???????p { ???????????color: blue; ???????}{# ???????2 ?.CLASS 类选择器#} ???????.bk{ ???????????color: lavenderblush; ???????}{# ???????3 ?.ID 选择器#} ???????#ok { ???????????color: ?lightseagreen; ???????}导航，头部，CSS基础
原文地址：http://www.cnblogs.com/lintingting/p/7689268.html