HTML笔记
HTML部分：
Html：标签语言,间隔用空格不用,或;
所有都是用标签操作<XXX></ XXX >
从<XXX>开始，到<XXX>结束，有些标签直接在开始标签内结束，如<hr/>,<br/>
设置属性时，属性值必须加””
Html操作思想：当要实现不同效果的文字或图片时，用不同的标签将各自的文字或图片包起来，在通过修改标签内的属性值来实现改变样式的效果。
一、常用标签:
<head>:包含网页文档信息，浏览器不会向用户显示这些头部信息（"head information"）。下面这些标签可用在 head 部分：<base>, <link>, <meta>, <script>, <style>, 以及 <title>。
<html>:html网页标签，包含所有标签
<title>:标题栏
<hr/>:水平线
<br/>:换行符
<h?>:?在范围1-6之间，设置一个可变大小标题，同时会自动换行
<body>: body 元素定义文档的主体。其中包含文档的所有内容（比如文本、图像、颜色、图形等等）。
二、文字标签和注释标签：
<font>:文字标签，规定文本的字体外观、字体尺寸和字体颜色。
属性:size:设置文字大小(1-7)，默认大小为7
color:设置文字颜色，可用color=”red”,或color=”#9900cc”(十六进制表示颜色法)
<!-- …-->:注释标签，可在…部分添加注释
三、水平线标签和特殊字符
</hr>:水平线标签。
属性：size:设置线的粗细(1-7)，默认大小为7
Color;设置线的颜色，同样俩种表示法:
特殊字符：当在网页上显示以下内容时：<html>是网页标签
要使用转义字符将<html>里的格式：<字符代码>转换为字符形式。
< 字符使用<%lt>;
>字符使用<>>;
当显示多个空格时，同样需要转义字符:
四、列表标签
1、普通列表标签
比如要显示以下效果：
武汉生物工程学院
教务处
财务处
学管处
通过<dl>，<dt>,<dd>三个标签实现
<dl>:表示列表的范围
在<dl>里面<dt>: 设置列表标题
在<dl>里面<dd>:设置列表内容
2、有序列表标签
1.教务处
2.财务处
3.学管处
使用<ol>和<li>
<ol>:表示列表范围 属性:type,可设置为,”1”（默认）,”a”,”i”。
<li>:表示列表内容
3、符号列表标签
使用<ul>和<li>
<ul>表示符号列表范围 属性:type,可设置为实心圆(disc)(默认),空心圆(circle),实心方块(square)。
<li>:表示列表内容
五、图像标签（重点）
<img src=”图片的路径”/>
属性
src:图片的路径
width:图片的宽度
height:图片的高度
alt:鼠标停留片刻后图片上显示文字,有些浏览器不支持，较少使用
六、路径(默认目录为当前项目目录)
绝对路径：从其它地方获取信息的路径
如: C:\Users\13928\Desktop\Qt素材\图片1.png、
https://www.baidu.com/b.jpg
相对路径：从当前项目目录获取信息的路径
如:b.jpg
因为默认目录为当前项目目录，表示下层目录:文件夹名/b.jpg即可
表示上层目录： ../b.jpg
七、超链接标签
1、链接资源
<a href=”链接到的路径”>显示在页面上的内容</a>
属性
href:链接到的路径，必须以/开头，是相对路径
target:打开方式，在新窗口打开(_blank),在当前页打开(_self)(默认)当超链接不需要链接到某些资源时，设置路径
为#即可，如不设置路径，会打开项目路径。即<a href=”#”>这个链接不链接任何资源</a>
2、定位资源（注意：位置名称可随意设置，如top等）
定义一个位置: <a name=”位置名称”>顶部</a>
回到位置:<a href=”#位置名称”>回到顶部</a>
3、原样输出标签:使用<pre>标签，写什么样输出什么样。
Public static void main(String agrs[]){
System.out.println(“Hello”);
}
八、表格标签
1、基本标签
<table>:表示表格范围
属性:
border:表格线的粗细
cellspacing:单元格之间距离（为0时级没有距离，重合为一条线）
width:表格宽度
height:表格高度
bordercolor:表格外围线颜色
<tr>:表示一个元组范围（一行数据（记录）范围）
属性:
align:元组里的对齐方式 left center right
<td>:表示元组范围里的单元格
属性:
align:单元格里的对齐方式left center right
<th>也同样可以表示单元格,与<td>不同：<th>自动设置了居中和加粗
<caption>:表格标题标签，在<table>和<tr>之间使用
2、合并单元格
跨行合并单元格:rowspan
跨列合并单元格:colspan
使用方式：在合并后的单元格属性rowspan或colspan里设置合并的行数或烈数
如:
<table border="1" cellspacing="0" width="400" height="150">
<caption>人员信息</caption>
<tr align="center">
<td>名字</td>
<td>性别</td>
<td>武力值</td>
</tr>
<tr align="center">
<td>关羽</td>
<td>男</td>
<td>98</td>
</tr>
<tr align="center">
<td>貂蝉</td>
<td>女</td>
<td>20</td>
</tr>
</table>
九、表单标签（重中之重）
<form>:包含表单的范围
属性：
action:输入项数据提交到的页面路径，默认为提交到当前页面
method:表单提交方式，get(默认)，post
enctype:一般不需要这个属性，在文件上传时需要使用
面试题目：get和post区别？
get会在地址栏显示提交信息，post不会显示提交信息，信息在请求体里。
get安全性低，post安全性高.
get有数据大小限制，post没有
输入项：可以输入或选择内容的部分
输入项的注意事项：
***绝大部分输入项使用<input type=”输入项的类型” />
***输入项必须设置一个name属性，才能获得数据,提交至服务器
文本输入:<input type=”text”/>
密码输入:<input type=”password”/>
单选框输入<input type=”radio” name=”属性名称” value="">
复选框输入<input type=”checkbox” name=”属性名称” value=""/>
文件输入<input type="file"/>
隐藏项<input type=”hidden”>不会在页面显示，但存在于html代码中单选框和复选框使用的注意事项：
1、 必须要有name属性2、name属性值必须相同
3、必须要有value属性
4、实现默认选中使用checked属性：checked=”checked”
下拉选择(不属于input)
<select name=”birth”>
<option value=”1”>请选择</option>
<option value=”1996”>1996</option>
<option value=” 1997”>1997</option>
<option value=” 1998”>1998</option>
</select>
1、 value属性用来设置提交的数据值，与显示内容应该一致
2、 实现默认选中使用selected属性：selected=”selected”
文本框<textarea>
属性:
rows:文本框的行
cols:文本框的列
提交按钮<input type=”submit”/>
属性
value:设置按钮上显示内容
提交时的数据小结:
如：
file:///E:/code/Html/Label.html?phone=22&password=22&sex=woman&sports=run&birth=1996
file:///E:/code/Html/Label.html?phone=%3D%22post%22&password=%3D%22post%22&sex=woman
显然输入项的提交通过标签里的name属性和value属性完成
name对应的数据类型名 values对应的数据值
提交的页面可通过<form>里的action属性修改
使用图片提交效果:
<input type=”image”,src=”图片地址”/>
重置按钮:将表单重置为初始化状态
<input type="reset"/>
普通按钮:就一个普通按钮，无任何操作
<input type="button" value="">
十、其它常用标签的使用
<b>:加粗
<s>:删除线
<u>:下划线
<i>:斜体
<sub>:下标
<sup>:上标
<pre>:原样输出
<p>:段落标签，比<br/>标签在结尾多换一行
在css里经常使用
<div>:所有<div>里内容自动换行
<span>:所有<span>里内容缩在一行
十一、头标签的使用
<html>里包含了<head>和<body>,<head>就是头标签，用来设置页面的属性
<title>:设置标签上显示内容
<meta>:设置页面相关内容
//早期搜索引擎根据content里的内容显示搜索网页
<meta name="keywords" content="页面介绍内容">
几秒后转向其它页面功能实现:
<meta http-equiv="refresh" content="5,url=register.html"/> //其中5为几秒后刷新，url为转到的页面地址<base>:设置超链接的基本设置
统一设置超链接打开一个新窗口方式:<base target="_blank"/>
<link>:引入外部文件
