HTML概述
html------Hyper Text Markup Language，即超文本标记语言。
1、主体框架
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
</body>
</html>
(1)、"utf-8"为国际通用字符编码，将charset设置为这样是为了防止中文字符显示为乱码
(2)、title标签中为一个网页的标题
(3)、body中的内容为整个HTML网页的内容，网页中显示的所有内容都必须写在其中，否则就会报错或者无法显示。
2、HTML元素
HTML中的标签分为内联元素、块级元素以及内联块级元素
2-1、基本元素
1、常见的内联元素有：
a、span、br、i、em、b、strong、label
2、常见的块级元素有：
div、p、h1~h6、ol、ul、dl、table、from
3、常见的内联块状元素有：
img、input
4、注释
<!-- 这里是注释掉的内容 -->
5、元素详解
<!-- 下边是一些元素的使用及详解 -->
<h1>标题标签</h1> <!-- h1~h6为由大到小的标题标签 -->
<p>段落标签</p> <!-- 用以文章区分段落，是段落标记 -->
<Strong>加粗标签</Strong> <!-- 此标签中的内容是加粗的，跟此标签效果相同的为“b”标签 -->
<em>斜体</em> <!-- 此标签的内容是倾斜的，与之效果相同的为“i”标签 -->
<div>块标签</div> <!-- 用来放置一些区域化的内容 -->
<u>下划线标签</u> <!-- 用来给文字加上下划线 -->
<s>删除线标签</s> <!-- 给内容加上删除线 -->
<hr /> <!-- 单标签，不需要结束标签，表示创建一条水平线 -->
6、图片标签
<!-- 图片标签，用来放置图片 -->
<img src="imagePath">
(1)、src中放置图片路径，一般都用相对路径
(2)、在放置的图片与HTML文件同级时直接写图片文件名；在不同级的情况下，需要跳几级，就在文件名前加上几个 . . /
7、表格元素
<table> <!-- 表格标签，定义HTML的表格，表格的内容需放在此标签中 -->
<tr><!-- 定义表格的行 -->
<th>Header</th><!-- 定义表格的表头，表头默认加粗居中 -->
<td>Data</td><!-- 定义表格的单元格，即表格的列 -->
</tr>
</table>
8、a链接标签
<a href="" target="" title=""></a> <!-- a链接标签，href中写此链接跳转的地址 -->
(1)、target属性指定了目标资源的显示位置，即跳转地址的显示位置，
(2)、target的值默认为_self（在同一窗口打开），其他值为_blank（在新窗口中打开）
(3)、title属性表示调用一个提示窗口，“”中的内容就是弹出的窗口的内容
(4)、href中的值为#this表示跳转到一个name为this的位置
2-2、表单元素
表单元素中使用的是input标签，此标签为单标签，只用一个就行，不需要写结束标签
form表示表单，所有的表单元素及input都必须卸载form标签之中
<form action="" method="">
</form>
1、文本框和密码框
<!-- 文本框 -->
<input type="text" name="" id="" value="" />
<!-- 密码框 -->
<input type="password" name="" id="" value="" />
(1)、type中为text表示为文本框，可在其中输入文本；
(2)、type中为password表示为密码框，输入其中的内容会自动保护，通常显示为*
2、单选框
<!-- 单选框 -->
<input type="radio" name="sex" id="" value="" />
<input type="radio" name="sex" id="" value="" />
(1)、type中为radio表示为单选框，可在几者之间选取一个；
(2)、要完成一个单选框需要二及以上个input标签，才能做选择，需要注意的是，单选框的所有input的name必须要相同，否则不能进行。
3、多选框
<!-- 多选框 -->
<input type="checkbox" name="sport1" id="" value="" />
<input type="checkbox" name="sport2" id="" value="" />
<input type="checkbox" name="sport3" id="" value="" />
<input type="checkbox" name="sport4" id="" value="" />
(1)、type中为checkbox表示为单选框，可在几者之间选取多个；
(2)、多选框的name不固定，可以相同，也可以不同
4、下拉列表
<!-- 下拉列表 -->
<select>
<option id="1">1</option>
<option id="2">2</option>
<option id="3">3</option>
<option id="4">4</option>
<option id="5">5</option>
</select>
(1)、下拉列表需要包裹在select标签之中，列表中的每一项使用option标签
5、文本域
当要输入的文字过多，text文本框放不下时，就可以用文本域
<!-- 文本域 -->
<textarea rows="" cols="">
</textarea>
(1)、文本域使用textarea标签，rows设置文本域的长（高），cols设置了文本域的宽。
6、按钮
<input type="button" name="" id="" value="按钮" />
<input type="submit" name="" id="" value="提交" />
<input type="reset" name="" id="" value="重置" /><!-- 可将输入框的改动复原 -->
<input type="image" src="" /><!-- 图像提交 -->
(1)、所有的按钮都可以使用button来显示，提交和重置是特殊的按钮；
(2)、type为image为图像提交，src中放置图像地址
7、button按钮标签
<button>按钮</button> <!-- 文字内容 -->
<button><img src=" "/></button> <!-- 图片内容 -->
(1)、button标签有更丰富的功能，标签的内容可以是文字，也可以是图像
2-3、列表元素
有序列表
<!-- 有序列表 -->
<ol type="1">
<li>A</li>
<li>B</li>
<li>C</li>
</ol>
(1)、ol标签表示有序列表，type可以改变序号的样式，但type的值只有1、A、a、大写罗马数、小写罗马数；
(2)、li标签为列表项，有序和无序列表通用。
无序列表
<!-- 无序列表 -->
<ul type="square">
<li>A</li>
<li>B</li>
<li>C</li>
</ul>
(1)、ul标签表示有序列表，type可以改变序号的样式，但type的值只有disc、square、circle
(2)、type的默认值是实心圆disc，其他样式square为实心正方形，circle为空心圆。
自定义列表
<!-- 自定义列表 -->
<dl>
<dt></dt><!-- 用于生成自定义列表中的各列表项的标题 -->
<dd></dd><!-- 用于生成自定义列表的各列表项的说明文字段 -->
</dl>
(1)、dd标签默认有一个外边距，类似于向里缩进了；
4万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
