一、基础标签
1.<!DOCTYPE>
定义文档类型
2.<html>
代表 HTML 或 XHTML 文档的根。其他所有元素必须是这个元素的子节点。
3.<head>
代表关于文档元数据的一个集合,包括脚本或样式表的链接或内容。
4.<title>
定义文档的标题,将显示在浏览器的标题栏或标签页上。该元素只能包含文本,包含的标签不会被解释。
5.<body>
定义文档的主体
6.<h1>~<h6>
标题,h1字体最大最醒目,h6为最小标题。
7.<br>
折行符号,空标签。
8.<hr>
水平线。
9.<link>
用于链接外部的 CSS 到该文档。
10.<style>
用于内联CSS样式。
二、表单
1.<form>
定义html表单,常用于用户输入HTML表单。
<form action="form_action.asp" method="get">
action:表明提交数据的路径。
method:规定提交数据的方式。
2.<input>
标签用于搜集用户信息。根据不同的 type 属性值,输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
常用的有如下几种:
(1)输入文本域:
<form>
姓名:
<input type="text" name="fullname">
</form>
(2)输入密码:
举例:
<form>
密码:
<input type="password" name="password">
</form>
效果:
输入密码
(3)复选框
举例:
<form>
我喜欢自行车:
<input type="checkbox" name="Bike">
<br />
我喜欢汽车:
<input type="checkbox" name="Car">
</form>
效果如下:
复选框
(4)单选按钮
需要注意的是只有在两个input标签中设置name为相同名称时,才能达到复选效果。
举例:
<form>
男性:
<input type="radio" checked="checked" name="Sex" value="male" />
<br />
女性:
<input type="radio" name="Sex" value="female" />
</form>
效果:
单选框
(5)文本域
举例:
<textarea rows="10" cols="30">
rows表示行数,cols表示列数。
效果:
文本域
(6)按钮
举例:
<input type="button" value="爱改什么改什么">
效果:
按钮
三、框架
1.<frame>
定义框架集的窗口或框架。
2.<frameset>
定于框架集。
3.·<noframes>
定义针对不支持框架的用户的替代内容。
4.<iframe>
定义内联框架。
举例:
<iframe src="https://www.qq.com" frameborder=0 >QQ</iframe>
<p>一些老的浏览器不支持 iframe。</p>
<p>如果得不到支持,iframe 是不可见的。</p>
效果:
用iframe标签打开腾讯网
四、列表
-
<ol>
定义一个有序列表。 -
<ul>
定义一个无序列表。 -
<li>
定义列表中的列表项。 -
<dl>
定义一个定义列表(一系列术语和其定义)。 -
<dt>
代表一个由下一个 <dd> 定义的术语。 -
<dd>
代表出现在它之前术语的定义。
五、表格
-
<table>
定义多维数据。
2.<caption>
表格标题
3.<colgroup>
代表表格中一组单列或多列。
4.<col>
代表表格中的列。 -
<tbody>
代表表格中的一块具体数据(表格主体) -
<thead>
表头
7.<tfoot>
表格中的列摘要(表尾)。 -
<tr>
代表表格中的行。
9.<td>
表格中单元格。
10.<th>
表格中头部的单元格。
以上信息参考MDN中的html文档:https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML5/HTML5_element_list
网友评论