HTML常见标签和属性

2023-12-28 10:50:01

HTML常见标签和属性

主体

属性含义示例备注
<!DOCTYPE html>声明html5文档
<html>html页面根元素<html></html>
<head>定义文档信息<head></head>
<base>基本的链接地址、链接目标<base href="" target="" />
<link>文档于外部资源之间的关系<link rel="stylesheet" type="" href="" />
<meta>元数据
<script>定义客户端的脚本文件<script></script>
<title>文档标题<title>标题</title>
<style>行内样式<style></style>
<body>页面内容<body></body>

body中常见属性

属性含义示例备注
<div>区块，常用于布局<div></div>
<span>用来组合文档中的行为元素<span></span>
<h1>-<h6>内容标题<h1></h1>数字越小标题越大
<p>段落<p></p>段落内容
<a>链接<a href="" target="_blank"></a>href是跳转路径，target跳转方式
<img>图像<img src="" />src图片路径
<br>换行<br />
<map>定义图像地图<map></map>
<area>定义图像地图中的可点击区域<area></area>
<hr>水平线<hr />
<b>或<strong>文本加粗<b></b>
<em>斜体<em></em>
<i>斜体<i></i>
<small>文本缩小<small></small>
<sub>下标<sub></sub>
<sup>上标<sup></sup>
<pre>对空行和空格的处理<pre></pre>
<!--注释-->注释注释代码

表格

属性含义示例备注
<table>定义表格<table></table>
<th>表格表头<th></th>
<tr>表格行<tr />
<td>表格单元<td></td>
<caption>表格标题<caption></caption>
<colgroup>表格列的组
<col>表格列的属性<col></col>
<thead>表格页眉<thead></thead>
<tbody>表格主体<tbody></tbody>
border表格边框线的宽度
colspan跨行数字表示占几个单元
rowspan跨列
cellspacing表格间距cellspacing=“0”数字表示单元格之间的间距

列表

属性含义示例备注
<ol>有序列表<ol></ol>
<ul>无序列表<ul></ul>
<li>列表项<li></li>
<dl>定义列表<dl></dl>
<dt>定义列表项目<dt></dt>
<dd>自定义列表项的描述<dd></dd>

属性

属性含义备注
class定义类名class可以重复使用
id元素的唯一id唯一，页面中可以有多个但不能相同
href链接跳转链接地址
class定义类名class可以重复使用
class定义类名class可以重复使用
class定义类名class可以重复使用
class定义类名class可以重复使用
class定义类名class可以重复使用
class定义类名class可以重复使用

表单

属性含义示例备注
<form>表单<form></form>
<input>输入域<input />
<textarea>文本域<textarea />
<label>标签<label></label>
<fieldset>相关的表单元素
<legend>定义fieldset标题
<select>下拉选项列表
<optgroup>选项组
<option>下拉表中的选项
<button>按钮
<datalist>定义选项列表，用来定义input可能的值
<keygen>表单的秘钥对生成器
<output>不同类型的输入

form字段属性

属性含义示例备注
action表单提交的地址
method表单提交的方式get/put/post
novalidate不需要验证
target指定一个名称或一个关键字来指明表单提交数据接收后的展示
datalist输入域的选项列表
placeholder一种提示，描述输入域所期待的值
required必填项

input字段属性

属性含义示例备注
disabled禁用
max允许的最大值
min允许的最小值
maxlength规定输入字段的最大字符长度
pattern用于验证输入字段的模
readonly输入字段的值无法修改
required输入的字段是必输入项
size字段中可见字符数
step合法数字间隔
value默认值
range滑动条
search搜索字段
tel电话号码字段
time时间
urlurl定义域
week定义周和年

其他

属性含义示例备注
<iframe>内联的iframe
<time>时间
<nav>导航链接部分
<progress>任务的进度
<mark>带有记号的文本
<header>文档头部区域
<footer>文档脚部区域
<dialog>提示框或对话框
<details>细节描述
<command>命令按钮，如单项或多选
<atricle>页面独立的内容区域
<aside>页面侧边栏内容
<video>视频
<audio>音频
<source>多媒体资源
<track>媒体播放器文本轨迹

文章来源:https://blog.csdn.net/DHLSP15/article/details/135238156
本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。