<strong>加粗</strong>
<em>斜体</em>
<p>段落</p>
<span>设置单独样式</span>
<q>引用别人的话，自加双引号</q>
<blockquote>带缩进引入大段文本</blockquote>
<br />换行，标准写法
空格，注意最后的分号
<hr /> 横线，标准写法
<address>地址，斜体加单独换行</address>
<code>单行代码</code>
<pre>多行代码</pre>
<ul><li>新闻列表，无序</li></ul>
<ol><li>排行列表，有序</li></ol>
<div>切割块</div>
<div id="">id版块名称</div>
<tr>
<thead>列表头</thead>
<th></td>
<td>列表内容</td>
</tr>
table tr td,th{border:1px solid #000;}标签框
<table summary=""></table>summary表示摘要
<table><caption>列表标题</caption></table>
<a href="目标网址" title="鼠标滑过文本" target="_blank">链接文本</a>
<a href="mailto:yy@imooc.com?subject=观了不起的盖茨比有感&body=你好，对此评论有些想法。">发送邮件</a>
<img src="图片地址" alt="下载失败时的替换文本" title="提示文本"></img>
<form method="传送方式" action="服务器文件">
<input type="" name="为文本框命名，以备后台程序ASP 、PHP使用。" value="为文本输入框设置默认值。(一般起到提示作用)"/>
<textarea cols="50" rows="10">在这里输入内容...</textarea>
<input type="submit" value="确定" name="submit" />
<input type="reset" value="重置" name="reset" />
当 type="radio" 时，控件为单选框 当 type="checkbox" 时，控件为复选框
<form action="save.php" method="post" >
<label>性别:</label>
<label>男</label>
<input type="radio" value="1" name="gender" />
<label>女</label>
<input type="radio" value="2" name="gender" />
</form>
<form action="save.php" method="post" >
<label>爱好:</label>
<select>
<option value="看书">看书</option>
<option value="旅游" selected="selected">旅游</option>
<option value="运动">运动</option>
<option value="购物">购物</option>
</select>
</form>
<form action="save.php" method="post" >
<label>爱好:</label>
<select multiple="multiple">
<option value="看书">看书</option>
<option value="旅游">旅游</option>
<option value="运动">运动</option>
<option value="购物">购物</option>
</select>
</form>
<label for="控件id名称">
<style type="text/css">
span{
color:red;
}
</style>
<link href="base.css" rel="stylesheet" type="text/css"/>
直接使用css中已有的标签如Body， span， blockquote
“选择器”指明了{}中的“样式”的作用对象
p{font-size:12px;line-height:1.6em;}
.类选择器名称{CSS样式代码;}
.setGreen{
color:green;
}
#id选择器，使用<id>
#setGreen{
color:green;
}
ID选择器只能在文档中使用一次
可以使用类选择器词列表方法为一个元素同时设置多个样式
子选择器，即大于符号(>),用于选择指定标签元素的第一代子元素
.first>span{
border:1px, solid, red;
}
通用选择器是功能最强大的选择器，它使用一个（*）号指定，它的作用是匹配html中所有标签元素
* {color:red;font-size:20px}
更有趣的是伪类选择符，为什么叫做伪类选择符，它允许给html不存在的标签（标签的某种状态）设置样式，比如说我们给html中一个标签元素的鼠标滑过的状态来设置字体颜色： a:hover{color:red;font-size:20px}鼠标滑过字体会变大。
当你想为html中多个标签元素设置同一个样式时，可以使用分组选择符（，），如下代码为右侧代码编辑器中的h1、span标签同时设置字体颜色为红色：
h1,span{color:red;}
.first, #second span{color:green;} 将class=”first“的标签设为绿色，将id="second"标签下的span设置为绿色。
标签的权值为1，类选择符的权值为10，ID选择符的权值最高为100。
p{color:red;} /*权值为1*/
p span{color:green;} /*权值为1+1=2*/
.warning{color:white;} /*权值为10*/
p span.warning{color:purple;} /*权值为1+1+10=12*/
#footer .note p{color:yellow;} /*权值为100+10+1=111*/
有些特殊的情况需要为某些样式设置具有最高权值,这时候我们可以使用!important来解决.
p{color:red!important;}
p span{font-weight:bold;}粗体
p a{font-style:italic;}斜体
p a{text-decoration:underline;}下划线
.oldPrice{text-decoration:line-through;}删除线
p{text-indent:2em;}段落排版--缩进,注意：2em的意思就是文字的2倍大小。
p{line-height:2em;}段落排版--行间距（行高）
h1{ word-spacing:20px;}段落排版--中文字间距、字母间距,只有有空格的地方才会起作用
h1{ letter-spacing:20px;}所有字符都要隔开
div{text-align:center;}段落排版--对齐
常用的块状元素有：
<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>
常用的内联元素有：
<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>
常用的内联块状元素有：
<img>、<input>
块级元素特点：
1、每个块级元素都从新的一行开始，并且其后的元素也另起一行。（真霸道，一个块级元素独占一行）
2、元素的高度、宽度、行高以及顶和底边距都可设置。
3、元素宽度在不设置的情况下，是它本身父容器的100%（和父元素的宽度一致），除非设定一个宽度。
a{display:block;}设置display:block就是将元素显示为块级元素。如下代码就是将内联元素a转换为块状元素，从而使a元素具有块状元素特点。
内联元素特点：
1、和其他元素都在一行上；
2、元素的高度、宽度及顶部和底部边距不可设置；
3、元素的宽度就是它包含的文字或图片的宽度，不可改变。
当然块状元素也可以通过代码display:inline将元素设置为内联元素。如下代码就是将块状元素div转换为内联元素，从而使 div 元素具有内联元素特点。
inline-block 元素特点：
1、和其他元素都在一行上；
2、元素的高度、宽度、行高以及顶和底边距都可设置。
代码display:inline-block就是将元素设置为内联块状元素。(css2.1新增)，<img>、<input>标签就是这种内联块状标签