HTML5 常用标签

 

HTML5中常用的标签和高级标签有很多,以下是其中比较常用的标签及其作用说明和标签属性说明:

 

常用标签

1. <html>标签

<html>标签是HTML文档的根元素,它包含了整个HTML文档。它的属性有:

 

 

lang:指定页面的主要语言,值为语言代码,例如en表示英语,zh-CN表示简体中文。

 

2. <head>标签

<head>标签包含了一些不会在页面上显示的信息,如页面的标题、关键字、描述等。它的属性有:

 

 

profile:指定页面所用的配置文件的URL。

 

3. <title>标签

<title>标签定义了页面的标题,显示在浏览器的标题栏中。

 

4. <body>标签

<body>标签包含了页面上显示的内容。

 

5. <h1>~`

`标签

<h1>~`

 

标签定义了标题,其中

最大,

`最小。它们的属性有:

 

 

align:设置标题的对齐方式,值可以是left、center或right。

 

 

6. <p>标签

<p>标签定义了一个段落。

 

7. <a>标签

<a>标签定义了一个超链接,可以链接到另一个网页或同一页面内的某个元素。它的属性有:

 

 

href:指定链接的URL。

 

target:指定链接打开的方式,值可以是_blank(在新窗口中打开)、_self(在当前窗口中打开)等。

 

8. <img>标签

<img>标签定义了一个图片。它的属性有:

 

 

src:指定图片的URL。

 

alt:指定图片的替代文本,当图片无法显示时,会显示替代文本。

 

9. <ul>和<li>标签

<ul>标签定义了一个无序列表,其中每个列表项使用<li>标签定义。

 

10. <ol>和<li>标签

<ol>标签定义了一个有序列表,其中每个列表项使用<li>标签定义。

 

11. <table>、<tr>、<td>标签

<table>标签定义了一个表格,其中每行使用<tr>标签定义,每个单元格使用<td>标签定义。这些标签的属性有:

 

 

border:指定表格边框的宽度,值为0表示无边框。

 

cellpadding:指定单元格内边距的大小。

 

cellspacing:指定单元格之间的间隔大小。

 

12. <form>、<input>、<button>标签

<form>标签定义了一个表单,其中可以包含多个输入框和按钮。<input>标签用于定义输入框,可以定义多种类型的输入框,如文本框、密码框、复选框等。<button>标签定义了一个按钮,用于提交表单或执行某些操作。这些标签的属性有:

 

 

<form>标签属性:

 

action:指定表单提交的URL。

 

method:指定表单提交的方式,值可以是get或post。

 

 

 

<input>标签属性:

 

type:指定输入框的类型,如text、password、checkbox等。

 

name:指定输入框的名称。

 

value:指定输入框的默认值。

 

 

 

<button>标签属性:

 

type:指定按钮的类型,值可以是submit(提交表单)、reset(重置表单)或button(普通按钮)。

 

name:指定按钮的名称。

 

 

 

高级标签

1. <header>标签

<header>标签定义了页面或页面中的某个区域的头部信息。

 

2. <nav>标签

<nav>标签定义了页面的导航栏。

 

3. <aside>标签

<aside>标签定义了页面的侧边栏,用于显示与页面主要内容相关的信息。

 

4. <section>标签

<section>标签用于定义页面的某个区域。

 

5. <article>标签

<article>标签用于定义独立的文章、帖子或独立内容块。

 

6. <footer>标签

<footer>标签定义了页面或页面中的某个区域的底部信息。

 

7. <canvas>标签

<canvas>标签用于绘制图形、动画等。它的属性有:

 

 

width:指定画布的宽度。

 

height:指定画布的高度。

 

8. <audio>标签和<video>标签

<audio>标签用于播放音频文件,<video>标签用于播放视频文件。它们的属性有:

 

 

src:指定音频或视频文件的URL。

 

controls:指定是否显示播放控件。

 

9. <progress>标签和<meter>标签

<progress>标签用于显示进度条,<meter>标签用于显示某个量的大小。它们的属性有:

 

 

<progress>标签:

 

value:指定进度条的当前值。

 

max:指定进度条的最大值。

 

 

 

<meter>标签:

 

value:指定量的当前值。

 

min:指定量的最小值。

 

max:指定量的最大值。

 

 

 

10. <datalist>标签和<option>标签

<datalist>标签用于定义一个选项列表,<option>标签用于定义选项。它们的属性有:

 

 

<datalist>标签:

 

id:指定选项列表的ID。

 

 

 

<option>标签:

 

value:指定选项的值。

 

 

 

11. <details>标签和<summary>标签

<details>标签用于定义一个可折叠的内容块,<summary>标签用于定义折叠内容块的摘要。它们的属性有:

 

 

<details>标签:

 

open:指定内容块是否默认展开。

 

 

 

<summary>标签:

 

无特殊属性。

 

 

 

12. <output>标签

<output>标签用于显示计算结果或用户输入的值。它的属性有:

 

 

for:指定与该输出相关联的表单元素的ID。

 

name:指定输出的名称。

 

 

  • 1
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值