Web前端开发|HTML5有哪些常用标签?_惠州前端培训学校
作者:hz_admin01发布时间:2022-04-10分类:前端开发专业浏览:927
Web前端开发|HTML5有哪些常用标签?下面惠州北大青鸟老师给大家分享一下,希望对大家有帮助。
HTML5的标签有很多很多,如果全部学完很难,我在这里介绍一些比较常用的标签,我把它们大致分成7类:文件标签、文本标签、图片标签、列表标签、链接标签、表格标签和表单标签。
一、文件标签
文件标签是构成HTML最基本的标签。我在这里讲解四个最基本的文件标签。
①html标签
html标签是HTML文档的根标签,用来告知浏览器其自身是一个HTML文档,<html>与</html>标签限定了文档的开始点和结束点,在它们之间是文档的头部和主体。
②head标签
head标签是头标签,它用于定义文档的头部,它是所有头部元素的容器。<head>中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等,它描述了文档的各种属性和信息,包括文档的标题、在Web中的位置以及和其他文档的关系等。
③title标签
title标签是标题标签,它可定义文档的标题。浏览器会以特殊的方式来使用标题,并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样,当把文档加入用户的链接列表或者收藏夹或书签列表时,标题将成为该文档链接的默认名称。
④body标签
body标签是体标签,它定义文档的主体,包含文档的所有内容(比如文本、超链接、图像、表格和列表等)。
二、文本标签
文本标签就是和文本有关的标签,我在这里简单介绍几种文本标签。
①注释标签
注释标签(<!--...-->)用于在源代码中插入注释。注释不会显示在浏览器中。可以使用注释对代码进行解释,这样做有助于在以后的时间对代码的编辑。当编写了大量代码时尤其有用。
②h1~h6标签
h1~h6标签是标题标签,它可以定义标题,从h1到h6字体不断变小。
③p标签
p标签是段落标签,它可以定义段落。它会自动在其前后创建一些空白。浏览器会自动添加这些空间,也可以在样式表中规定。
④br标签
br标签是换行标签,它可以插入一个简单的换行符。br标签是空标签(意味着它没有结束标签,因此这是错误的:<br></br>)。
⑤hr标签
hr标签是分隔线,它可以在HTML页面中创建一条水平线,可以在视觉上将文档分隔成各个部分。
⑥b、i标签
b、i标签分别是加粗、斜体标签。
三、图片标签
图片标签比较简单,只有一个img标签,我来说一下img标签常用的属性。
src属性:规定显示图像的URL。
alt属性:规定图像的替代文本。当图像加载失败时就会显示该文本。
align属性:规定图像的对齐方式。
width属性:设置图像的宽度。
height属性:设置图像的高度。
四、列表标签
列表标签也比较常用,它包括有序列表和无序列表。
①有序列表
ol标签用来定义有序列表。
li标签用来定义列表项。
type属性规定在列表中使用的标记类型。属性值包括1、A、a等。
②无序列表
ul标签用来定义无序列表。
li标签用来定义列表项。
type属性规定在列表中使用的标记类型。属性值包括disc、square、circle。
五、链接标签
链接标签也比较简单,只有一个a标签,它可以定义超链接,用于从一张页面链接到另一张页面。下面介绍一些属性。
href属性:这是超链接最重要的属性,它规定链接指向的页面的URL。
target属性:规定在何处打开链接文档。
· _self属性值(默认):在当前页面打开;
· _blank属性值:在空白页面打开。
六、表格标签
HTML表格需要使用table标签来定义。
简单的HTML表格由table元素以及一个或多个tr、th 或td元素组成。tr元素定义表格行,th元素定义表头,td元素定义表格单元。
更复杂的HTML表格也可能包括caption、col、colgroup、thead、tfoot以及tbody元素。
表格的常用属性比较多,下面列举几个:
align属性:规定表格相对周围元素的对齐方式。
bgcolor属性:规定表格的背景颜色。
border属性:规定表格边框的宽度。
cellpadding属性:规定单元边沿与其内容之间的空白。
cellspacing属性:规定单元格之间的空白。
width属性:规定表格的宽度。
七、表单标签
表单是用于采集用户输入的数据的,用于和服务器进行交互。form标签用于为用户输入创建HTML表单。表单标签有两个常用的属性:
action属性:规定当提交表单时向何处发送表单数据。
method属性:规定用于发送form-data的HTTP方法。包括两个属性值:
get属性值:请求的参数会在地址栏显示;参数大小有限制;不太安全。
post属性值:请求参数封装在请求体中;参数大小没有限制,较为安全。
表单标签中通常会带有表单项标签,比如input、select、textarea等。
①input标签
input标签用于搜集用户信息。根据不同的 type属性值,输入字段拥有很多种形式。
· text属性值(默认):定义单行的输入字段,用户可在其中输入文本。
· password属性值:定义密码字段。该字段中的字符被掩码。
· radio属性值:定义单选按钮。注意同一组选项中name属性值必须一致。
· checkbox属性值:定义复选框。
· file属性值:定义输入字段和 "浏览"按钮,供文件上传。
· hidden属性值:定义隐藏的输入字段。
· submit属性值:定义提交按钮。提交按钮会把表单数据发送到服务器。
· image属性值:定义图像形式的提交按钮。
· button属性值:定义可点击按钮(多数情况下,用于通过JavaScript启动脚本)。
②select标签
select标签可以创建单选或多选菜单。option标签用于定义列表中的可用选项。select标签的常用属性有:
· name属性:规定下拉列表的名称。
· size属性:规定下拉列表中可见选项的数目。
· required属性:规定文本区域是必填的。
· multiple属性:规定可选择多个选项。
③textarea标签
textarea标签定义多行的文本输入控件。文本区中可容纳无限数量的文本,可以通过cols和rows属性来规定textarea的尺寸,不过更好的办法是使用CSS的height和width属性。
想了解更多关于前端的知识吗?可以来惠州北大青鸟新方舟校区了解一下。
标签:惠州前端培训学校惠州前端基础惠州前端培训北大青鸟IT计算机学校北大青鸟IT软件学校前端北大青鸟IT学校惠州北大青鸟北大青鸟
- 前端开发专业排行
- 标签列表
-
- Java (3694)
- 北大青鸟 (3713)
- 软件开发 (3613)
- JAVA (3413)
- UI设计入门 (2093)
- 惠州北大青鸟 (4375)
- 惠州IT培训 (2558)
- UI设计培训 (2090)
- 惠州UI设计培训 (2095)
- 惠州UI设计培训学校 (2090)
- 惠州计算机软件培训 (6260)
- 惠州计算件软件开发 (6260)
- 惠州计算机软件基础 (6261)
- 惠州计算机JAVA培训 (3574)
- 惠州计算机Java软件开发 (3620)
- 惠州计算机JAVA软件开发 (4645)
- 惠州计算机JAVA软件开发学校 (3338)
- 惠州计算机Java软件开发培训 (3338)
- 北大青鸟IT计算机学校 (5048)
- 北大青鸟IT软件学校 (5062)
- 北大青鸟IT学校 (5059)
- 惠州计算机UI设计软件开发 (2088)
- UI设计基础教程 (2088)
- UI设计是什么 (2088)
- UI设计教程 (2088)
- 网站分类
-
- 计算机教程
- 计算机入门
- 职业学校
- 新闻动态
- 专业课程
- 热门技术
- SEO
- 培训教程
- windows
- linux教程
- 系统集成
- 网站开发
- Html5
- 办公软件
- 师资力量
- 热点问答
- 联系我们
- 计算机学校
- 惠州计算机学校
- 河源计算机学校
- 广州计算机学校
- 深圳计算机学校
- 湛江计算机学校
- 佛山计算机学校
- IT计算机培训信息
- 设计专业
- UI
- 影视特效
- 游戏动漫设计
- Photoshop
- AI设计
- 软件教程
- Java技术
- C语言/C++语言培训
- C#
- Python技术
- PHP
- 数据库
- SQL Server
- 网络教程
- 网络安全
- 网络营销
- 软件专业
- 大数据专业
- 前端开发专业
- 软件测试专业
- Python专业
- 软件实施
- 珠海计算机学校
- 初中生学什么好
- 计算机认证
- 文章归档
-
- 2024年11月 (14)
- 2024年10月 (32)
- 2024年9月 (29)
- 2024年8月 (68)
- 2024年7月 (59)
- 2024年6月 (43)
- 2024年5月 (48)
- 2024年4月 (80)
- 2024年3月 (65)
- 2024年2月 (54)
- 2024年1月 (25)
- 2023年12月 (12)
- 2023年11月 (73)
- 2023年10月 (134)
- 2023年9月 (34)
- 2023年8月 (3)
- 2023年7月 (3)
- 2023年6月 (12)
- 2023年5月 (30)
- 2023年4月 (72)
- 2023年3月 (11)
- 2023年2月 (34)
- 2023年1月 (37)
- 2022年12月 (78)
- 2022年11月 (359)
- 2022年6月 (1193)
- 2022年5月 (570)
- 2022年4月 (1567)
- 2022年3月 (982)
- 2022年2月 (54)
- 2022年1月 (182)
- 2021年9月 (308)
- 2021年8月 (1704)
- 2021年7月 (2423)
- 2021年6月 (1806)
- 2021年5月 (1569)
- 2021年4月 (1380)
- 2021年3月 (1255)
- 2021年2月 (709)
- 2021年1月 (1521)
- 2020年12月 (3626)
- 2020年11月 (1646)
- 2020年10月 (1046)
- 2020年9月 (592)
- 最近发表
-
- 清远信息:2024年广清杯清远南粤家政技能大赛举行决赛|||计算机培训机构
- 汕尾信息:陈良川带队到汕尾技师学院调研|||计算机职业技能培训班
- 东莞信息:凤岗凤岗镇组织召开社保参保缴费及劳动用工政策宣讲会|||计算机软件培训学校
- 阳江信息:2024年度注册城乡规划师职业资格考试的合格标准是怎样的?|||计算机软件培训学校
- 阳江信息:职业技能提升补贴对象有哪些?|||大学生计算机培训学校
- 清远信息:清远市首家社保服务合作网点在清城区举办启动仪式|||计算机职业技能培训班
- 汕头信息:招聘658名中高端人才!2024年汕头市引进中高端人才专场招聘会举行|||北大青鸟计算机培训中心
- 东莞信息:广东省社保智能经办现场会在东莞召开|||大学生计算机培训学校
- 东莞信息:东坑镇举办2024年重点群体系列招聘活动|||计算机职业技能培训班
- 东莞信息:万江万江街道成功举办第四届粤菜师傅烹饪技能竞赛|||广州计算机编程培训