HTML 学习笔记

1 标签

块状元素：

1. 每个块状元素都从新的一行开始，并且其后的元素也另起一行。
2. 元素的高度、宽度、行高以及顶和底边距都可设置。
3. 元素宽度在不设置的情况下，和父容器的宽度一致。

内联元素：

1. 和其他元素都在一行上；
2. 元素的高度、宽度及顶部和底部边距不可设置；
3. 元素的宽度就是它包含的文字或图片的宽度，不可改变。

内联块状元素：

1. 和其他元素都在一行上；
2. 元素的高度、宽度、行高以及顶和底边距都可设置。

1.1 块状元素

<address> 联系地址信息

<blockquote> 引用，长文本

<caption> 表格标题

<div> 为网页划分独立的版块，起容器的作用

<dl>

<form> 表单

<h1>…<h6> h1-h6 各级标题

<hr /> 分割线

<li> 列表（内部）

<ol> 有序列表

<p> 段落

<pre> 格式化文本（多行代码）

<table> 表格

<tbody> 包含行的内容下载完优先显示，用其分段，可以一部分一部分地显示。

<tfooter>

<thead>

<ul> 无序列表。

1.2 内联元素

<a> 超链接

<br /> 换行

<code> 单行代码

<cite>

<em> 斜体

<i>

<label> 标签

<option> 下拉列表框-列表

<q> 引用，短文本

<select> 下拉列表框

<span> 设置单独式样

<strong> 粗体

<td> 表格的一个单元格

<th> 表格的头部的一个单元格，表格表头

<tr> 表格的一行

<var>

1.3 内联块状元素

<img> 图片

<input> 输入框

<textarea> 多行输入域

1.4 转义字符

显示结果	描述	字符
	空格	 
<	小于号	&lt;
>	大于号	&gt;

更多转义字符：https://blog.youkuaiyun.com/vola9527/article/details/69948411

2 标签属性

id 标签名称，唯一标识

summary 表格摘要，摘要的内容是不会在浏览器中显示出来的。它的作用是增加表格的可读性(语义化)，使搜索引擎更好的读懂表格内容，还可以使屏幕阅读器更好的帮助特殊用户读取表格内容。

<a>: href title target

1. href 目标网址
2. title 鼠标滑过显示的文本
3. target="_blank" 在新窗口中打开

<a href="目标网址" title="鼠标滑过显示的文本">链接显示的文本</a>

4. mail功能：
   
   注意：如果mailto后面同时有多个参数的话，第一个参数必须以“?”开头，后面的参数每一个都以“&”分隔。
   

<form>: action method

1. action 浏览者输入的数据被传送到的地方,比如一个PHP页面(save.php)。
2. method 数据传送的方式（get/post）。

<img>: src alt title

1. src 标识图像的位置。
2. alt 指定图像的描述性文本，当图像不可见时（下载不成功时），可看到该属性指定的文本。
3. title 提供在图像可见时对图像的描述(鼠标滑过图片时显示的文本)；
4. 图像可以是GIF，PNG，JPEG格式的图像文件。

<img src="图片地址" alt="下载失败时的替换文本" title = "提示文本">

<input>: type name value

1. type

   当type="text"时，输入框为文本输入框。

   当type="password"时, 输入框为密码输入框。

   当type="radio"时，控件为单选框。同一组的单选按钮，name 取值要一致。

   当type="checkbox"时，控件为复选框。

   当type="submit"时，控件为提交按钮。

   当type="reset"时，控件为重置按钮。

2. name 为文本框命名，以备后台程序ASP 、PHP使用。

3. value 为文本输入框设置默认值、提交数据到服务器的值（后台程序PHP使用）。

4. checked 当设置checked="checked"时，该选项被默认选中

<label>: for

1. <label>标签不会向用户呈现任何特殊效果，它的作用是为鼠标用户改进了可用性。如果你在<label>标签内点击文本，就会触发此控件。就是说，当用户单击选中该<label>标签时，浏览器就会自动将焦点转到和标签相关的表单控件上（就自动选中和该<label>标签相关连的表单控件上）。

<label for="控件id名称">	/*标签的 for 属性中的值应当与相关控件的 id 属性值一定要相同。*/

<option>: value selected

1. selected=“selected” 该选项默认选中

<option value="提交值">选项（显示的值）</option>

<select>: multiple
2. multiple=“multiple” 多选

<textarea>: cols rows
3. cols 多行输入域的列数。
4. rows 多行输入域的行数。
5. 在<textarea></textarea>标签之间可以输入默认值。

3 EL表达式

形式：${ }

4 jsp: 标签

<jsp:forward page=“metro/metroStationList.action”></jsp:forward> 转至某action