HTML5新增标签总结

最新推荐文章于 2024-06-12 11:12:56 发布

呼耿

最新推荐文章于 2024-06-12 11:12:56 发布

阅读量244

点赞数 1

分类专栏： HTML 文章标签： html5

本文链接：https://blog.csdn.net/qq_44626593/article/details/119710513

版权

HTML 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML5新增标签

HTML5之前标签总结

HTML5新增标签

语义化标签：代表一定意义的块级标签

<header> 标记定义一个页面的头部

<nav> 标记定义页面的导航栏

<aside> 标记定义内容的侧边栏

<main> 标记定义内容

<footer> 标记定义一个页面的底部

<header>页眉</header> 
<nav>导航栏</nav>   
<aside>侧边栏</aside>
<main>主题内容</main>
<footer>页脚</footer>

多媒体交互标签

<video> 标记定义一个视频

<video src="./videos/1.mp4"></video>

<audio> 标记定义音频内容

<audio src="./audios/1.mp3"></audio>

表单标签

*新增input表单元素

tel 验真输入是否是电话号码的格式

 <input type="tel" name="tel" placeholder="请输入手机号">

url 提交表单的时候验证输入值是否满足url的格式

<input type="url" name="url" placeholder="请输入地址">

date 选取日、月、年

<input type="date" name="date">

time 选取小时、分钟

<input type="time" name="time">

datetime-local 选取时间、日、月、年(本地时间)

 <input type="datetime-local">

search 用于搜索域

<input type="search">

placeholder 在用户输入时进行提示

requied 表示该元素是必填项

<input type="text" name="userName" placeholder="请输入账号" required  >

*新增表单标签

<datalist> 定义选项列表，配合<option>,<input>标签使用

<input list="cars"> 
<datalist id="cars"> 
       <option>飞机</option>
       <option>高铁</option>
       <option>大巴</option> 
</datalist>

其他标签

<mark> 标记定义高亮内容(黄色选中状态)

<mark>高亮</mark>

HTML5之前标签总结

基础标签：

<html> 定义HTML文档

<meta> 定义HTML文档的基本信息

<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title> 定义文档的标题

<body> 定义文档的主体

<h1>~<h6> 定义文档的标题级别1-6

<h1>一级标题</h1>

<p> 定义文档的段落

<p>我爱祖国的大山大河</p>

<br> 定义文档换行

<hr> 定义一条水平线

<style> 定义文档的样式信息

<script> 定义客户端脚本

<div> 定义一个块级元素

<span> 定义一个内联元素

格式标签：

<code> 定义计算机代码文本

<del> 定义被删除文本

<em> 定义文本斜体

<sub> 定义下标文本

H<sub>2</sub>O

<sup> 定义上标文本

 2 <sup>5</sup>

应用标签：

<img> 定义图像

<img src="./images/R-C.jpg">

<a> 定义链接

<link> 定义文档和外部资源的关系

<link rel="stylesheet" href="./css/commen.css">

表单标签：

<form> 定义供用户输入的HTML表单

<input> 定义输入控件

*password 不可见输入内容

<input type="password" name="uPass" placeholder="请输入密码">

*text 输入文本

<input type="text" name="userName" placeholder="请输入账号"  >

<textarea> 定义多行的文本输入控件

<button> 定义按钮

<select> 定义下拉列表

<option> 定义下拉列表的选项

<lable> 定义Input元素的标注

<fieldset> 对表单中的控制元素进行分组

<legend> 作为 fieldset 的标题

<fieldset>
        <legend>登录</legend>
        <form>
            <input type="checkbox" id="focus">
            <label for="focus">聚焦</label>
            <textarea></textarea>
            <select>
                <option>飞机</option>
                <option>高铁</option>
                <option>大巴</option>
            </select>
            <button>提交</button>
        </form>
</fieldset>

列表标签

<ul> 定义无序列表

<ol> 定义有序列表

<li> 定义列表的项目

<ul>
        <li>项目一</li>
</ul>
<ol>
        <li>项目一</li>
</ol>

<dl> 定义一个描述性列表

<dt> 定义列表中的项目

<dd> 定义列表中项目的描述

<dl>
        <dt>项目一</dt>
        <dd>项目一的内容</dd>
</dl>

表格标签

<table> 定义表格

<caption> 定义表格标题

<th> 定义表格中表头单元格

<tr> 定义表格中的行

<td> 定义表格中的单元

<thead> 定义表格中的表头内容

<tbody> 定义表格中的主体内容

<tfoot> 定义表格中的标注内容

<table>
        <caption>表格标题</caption>
        <thead>
            <tr>
                <th>表头</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>表格内容</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td>表格底部</td>
            </tr>
        </tfoot>
</table>

呼耿

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
HTML5新增标签总结

HTML5旧标签总结基础标签：<html> 定义HTML文档<meta> 定义HTML文档的基本信息<title> 定义文档的标题<body> 定义文档的主体<h1>~<h6> 定义文档的标题级别1-6...
复制链接

扫一扫