文本与文本格式标签

<p></p>  <!--段落标签-->
<b></b>        <!--加粗-->
<strong></strong>  <!--强调某段文本-->
<em></em>   <!--强调某段文本-->
<i></i>    <!--斜体-->
<br/>    <!--换行-->
<hr />    <!--水平线-->
<u></u>    <!--下划线标签-->
<del></del>    <!--删除线标签-->
<hn></hn>    <!--h族标题标签-->
<bdo></bdo>    <!--覆盖默认的文本方向-->
<sub></sub>    <!--下标文本-->
<sup></sup>    <!--上标文本-->
<details></details>    <!--交互式控件、可见的或者隐藏的补充细节-->
<summary></summary>    <!--为details定义标题-->
<dialog></dialog>    <!--定义对话框或窗口-->
<pre></pre>    <!--原格式输出-->
<figure></figure>    <!--用于对元素进行组合。多用于图片与图片描述组合-->
<mark></mark> <!--标记文本-->
<figure>
    <img src="img.gif" alt="figure标签"  title="figure标签" />
    <figcaption>figure的标题</figcaption>
</figure>
<mark></mark>
    定义带有记号的文本,它会给你要突出显示的文本下加个背景色。
    如:<p>你是<mark>大长腿</mark>吗?</p>

语义化标签

<div></div>
<span></span>
<header></header>
<footer></footer>
<nav></nav>
<address></address>
<section></section>
<article></article>
<aside></aside>

列表标签

<ul></ul>
<ol></ol>
<li></li>
<dl></dl>
<dt></dt>
<dd></dd>

超链接标签

<a></a>
<!--常用属性-->
<!--
    href = "" 用于定义需要跳转页面的地址
    target = "" 定义页面打开的方式
    常用的值:
        _self默认,当前窗口打开链接的文档
        _blank,在新窗口中打开文档
-->

多媒体标签

<img />
<map></map>
<area />
<audio></audio>
<source />
<video></video>
<embed />
<progress></progress>
<meter></meter>

表格相关标签及属性

  • 表格相关标签
<table></table>
<caption></caption>
<tr></tr>
<th></th>
<td></td>
<thead></thead>
<tbody></tbody>
<tfoot></tfoot>
  • table标签常用属性| 属性 | 描述 | 说明 | | :———: | :————————————–: | :———————: | | width | 表格宽度 | | | height | 表格高度 | | | align | 表格在页面的水平摆放位置 | 取值:left/center/right | | background | 表格的背景图片 | | | bgcolor | 表格的背景颜色 | | | border | 表格边框的宽度(以像素为单位) | 表格默认没有边框 | | bordercolor | 表格边框颜色 | 当border >= 1时起作用 | | cellspacing | 单元格之间的间距 | | | Cellpadding | 单元格内容与单元格边界之间的空白距离大小 | |
  • tr(行)标签常用属性| 属性 | 描述 | | :—–: | :——————: | | height | 行高 | | align | 行内容的水平对齐方式 | | valign | 行内容的垂直对齐方式 | | Bgcolor | 行的背景颜色 |
  • td(单元格)标签常用属性| 属性 | 描述 | | :———-: | :—————————————: | | width/height | 单元格的宽度和高度 | | align | 设置水平对齐方式,取值left/center/right | | valign | 设置垂直对齐方式,可取值top/middle/bottom | | bgcolor | 单元格的背景颜色 | | colspan | 设置单元格跨列 | | rowspan | 设置单元格跨行 |

表单相关标签

<form></form>用于为用户输入创建HTML表单
<!--
    必须属性:
    action -- 浏览者输入数据被传送到的地方,比如一个PHP页面
    method -- 数据传送的方式
                get -- 此方式传递数据量少,但是传递的信息会显示在网址上。
                post -- 此方式传递信息多,而且不会把传递的信息显示在网址上。
-->
<input />为用户定义需要使用的表单项
<!--
        name -- 此表单项的名称
        value -- 此表单项的值
        type -- 代表一个输入域的显示方式(输入型、选择型、点击型)
-->
<input type="text" name="" value="" /> 普通文本域
<input type="password" name="" value="" /> 密码域
<input type="radio" name="" value="" />单选
<input type="checkbox" name="" value="" /> 复选
<label></label>为input元素定义标注(绑定元素)
<input type="file" name="" value="" />文件上传
<input type="submit" name="" value="" />提交按钮
<input type="image" src="" title="" alt="" />用图片代替提交按钮
<input type="reset" name="" value="" />重置按钮
<input type="hidden" name="" value="" />隐藏域
<input type="button" name="" value="" />按钮
<button></button> 提交按钮
<button type="submit"></button>提交按钮
<button type="button"></button>按钮
<textarea></textarea> 多行文本输入域
<select></select>下拉列表
<option></option>为下拉列表定义列表项
<fieldset></fieldset>将表单内的相关元素分组
<legend></legend>为fieldset定义标题
<optgroup></optgroup>为下拉列表定义分组
<datalist></datalist>定义可选数据列表
<!--新增类型-->
<input type="email" name="" value="" />
<input type="url" name="" value="" />
<input type="number" name="" value="" />
<input type="range" name="" value="" />
<input type="search" name="" value="" />
<input type="color" name="" value="" />
<input type="tel" name="" value="" />
<input type="date" name="" value="" />
<input type="time" name="" value="" />
<input type="week" name="" value="" />
<input type="month" name="" value="" />
<input type="datetime-local" name="" value="" />
<!--表单中常用的属性-->
<!--
readonly 输入域可以选择,但是无法修改。
disabled 输入域无法获取焦点,无法选择,以灰色显示
selected 为下拉列表定义默认选种
autofocus 自动获取焦点属性
placeholder 表单提示信息
required 用于强制用户必须为该表单赋值,否则提示信息
min 用于设定表单的最小值
max 用于设定表单的最大值
multiple 设定当前表单允许同时选中多个文件,适用于input[type=file]
pattern 用于自定义验证规则(需要配合正则的语法)
step 设定跳步的数值或者设定2个数值之间的间隔
novalidate 取消表单验证,适用于form标签
formaction 用于在提交按钮中修改当前表单的提交页面
formmethod 用于在提交按钮中修改当前表单的提交方式
formenctype 用于在提交按钮中修改当前表单提交数据编码类型(不用,文件上传时适用)
tabindex    切换索引属性
-->

HTML全局属性

contentEditable 内容可编辑属性
designMode 页面可编辑属性

HTML框架标签

<frameset></frameset>代替body标签定义框架页(H5取消)
<frame />定义frameset标签中每个框架页的内容
<iframe></iframe>在页面中开一块空间连接一个子页面

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注