HTML/CSS标签（慕课网上截图，东西不多，有点乱）
部分标签的使用方法：
<hx>标题
<p>段落
<q>对简短文本的引用
<blockquote>对长文本的引用
<em><strong>
<span>
<address>地址
<code>显示一行代码语言
<pre>在网页中加入大段代码
<ul><li></li></ul>无前后顺序列表信息
<ol><li></li></ol>有前后顺序的列表信息
<table><tr><td></td></tr></table> <table summary="摘要"> <caption>标题
<a href="#" target="_blank"></a>链接在新窗口打开
<form method="post" action="save.php">
<label for="username">用户名:</label>
<input type="text" name="username" />
<label for="pass">密码:</label>
<input type="password" name="pass" />
</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>
结果：
label标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在 label 标签内点击文本，就会触发此控件。就是说，当用户单击选中该label标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就自动选中和该label标签相关连的表单控件上）。
1、使用内联式CSS设置“超酷的互联网”文字为粉色。
2、然后使用嵌入式CSS来设置文字为红色。
3、最后又使用外部式设置文字为蓝色（style.css文件中设置）。
但最终你可以观察到“超酷的互联网”这个短词的文本被设置为了粉色。因为这三种样式是有优先级的，记住他们的优先级：内联式 > 嵌入式 > 外部式
但是嵌入式>外部式有一个前提：嵌入式css样式的位置一定在外部式的后面。如右代码编辑器就是这样，<link href="style.css" ...>代码在<style type="text/css">...</style>代码的前面（实际开发中也是这么写的）。感兴趣的小伙伴可以试一下，把它们调换顺序，再看他们的优先级是否变化。
其实总结来说，就是--就近原则（离被设置元素越近优先级别越高）。
但注意上面所总结的优先级是有一个前提：内联式、嵌入式、外部式样式表中css样式是在的相同权值的情况
p{text-indent:2em;}段落缩进
p{line-height:2em;}行间距
css代码：
div{
200px;
padding:20px;
border:1px solid red;
margin:10px;
}
html代码：
<body> <div>文本内容</div> </body>
元素的实际长度为：10px+1px+20px+200px+20px+1px+10px=262px。在chrome浏览器下可查看元素盒模型，如下图：
不定宽度的块状元素有三种方法居中（这三种方法目前使用的都很多）：
- 加入 table 标签
- 设置 display: inline 方法：与第一种类似，显示类型设为 行内元素，进行不定宽元素的属性设置
- 设置 position:relative 和 left:50%：利用 相对定位 的方式，将元素向左偏移 50% ，即达到居中的目的
设计步骤：