Web前端开发复习——HTML基础
课程为北林的mooc，当做期末复习用
HTML概述
超文本标记语言，不区分大小写。
标签由尖括号包围，通常是成对出现的，但是也比如就是单独出现的。
标签的嵌套：
<html>
<body></body>
</html> (不能交叉嵌套)
标签的属性，在标签名后加，一个标签可能有多个属性，先后顺序不影响效果。
<img scr="" alt=""/>
HTML标签（1）——标题、段内换行、段内分组、段落、预留格式、水平线
标题：大小依次递减
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
段落：段落内部文字忽略连续空格，也不显示空行，且不会换行。
<p>段落内容</p>
段内换行:单独出现的标签，直接结束。
<br/>
空格字符：特殊字符，全是小写
预留格式：定义预格式化的文本，文本的空格和换行符会被保留。
<pre>
保留 空格
换行
</pre>
行内组合span:组合行内元素，通过CSS来格式化。（以后介绍）
水平线hr:
<hr/>
注释：
<!--注释内容-->
HTML标签（2）—— 超链接
可以加到文字或图片上，基本语法如下：
<a href="网址">文字或图片</a>
<a href="#">虚拟超链接</a>
可以连接到本站点其他网页，外部站点，或虚拟超链接。
HTML标签（3）——图像
插入图像：img标签,单独出现
<img src="路径" alt="图片无法显示时的提示信息"/>
绝对路径和相对路径：
后者是以网页文件所在位置为基准，建议使用后者。
HTML标签（4）——列表、区域、表格
区域：div
<div align="center">
<h1>
期末必过！
</h1>
<p>
儿童节快乐！
</p>
</div>
无序列表：ul,li（列表项）
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JS</li>
</ul>
有序列表：ol,li（列表项）
<ol>
<li>HTML</li>
<li>CSS</li>
<li>JS</li>
</ol>
表格：table tr td th
表头单元格th ,每一行tr，每一列td.
<table border="1">
<tr>
<th>班级</th>
<th>学生数量</th>
</tr>
<tr>
<td>一班</td>
<td>41人</td>
</tr>
<tr>
<td>二班</td>
<td>40人</td>
</tr>
</table>
自定义列表不仅仅是一列项目，而是项目及其注释的组合。
自定义列表以 <dl> 标签开始。每个自定义列表项以 <dt> 开始。每个自定义列表项的定义以 <dd> 开始
HTML标签（5）——表单与表单元素
表单form：是一个采集用户信息的区域
<form action="数据处理">
表单元素
</form>
表单元素包括文本框，按钮，单选，复选，下拉列表，文本域
文本框和密码框：input
<input type="text"/>文本框
<input type="password"/>密码框
按钮：type表示是提交、重置或其他，value表示按钮上显示的文字
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>
单选框和复选框：checked="checked"表示默认选中该选项
<input type="radio" value="" name="" check="checked"/>单选
<input type="checkbox" value="" name="" check="checked"/>多选
下拉列表框：select option
selected="selected"表示被选择的那一项
<select>
<option>看书</option>
<option selected="selected">编程</option>
</select>
文本域：textarea
<textarea rows="行数" cols="列数">默认显示的内容</textarea>