HTML5标签

最新推荐文章于 2023-08-04 12:22:36 发布
最新推荐文章于 2023-08-04 12:22:36 发布
阅读量1.1k 收藏 4
点赞数
分类专栏： Html5
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ziyuxuan90/article/details/79544426
版权
HTML5 <!DOCTYPE> 标签

<!DOCTYPE>声明html5的起点。也就是说它必须放在文档的第一行。

<!DOCTYPE html>
<html>
<head>
    <title>html5</title>
</head>
<body>
    hello word！
</body>
</html>
HTML5 <a> 标签

<a>标签主要用于超链接

<a href="http://www.baidu.com">访问百度!</a>
HTML5 <area>标签

<area>带有可点击图像的映射

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>
HTML5 <abbr> 标签
<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool(w3cschool.cn)</title> 
</head>
<body>
 <abbr title="hello word!">hw</abbr>
</body>
</html>

运行结果为hw

HTML5 <article>标签

标签定义独立内容，定义的内容有意义，必须独立于文档的其余部分 

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool(w3cschool.cn)</title> 
</head>
<body>
<article>
  <h1>我的订单</h1>
  <p> 我在京东买的订单</p>
</article>
</body>
</html>
HTML5 <aside> 标签

HTML5 <aside> 标签用来表示跟当前页面的内容没有很相关的部分，通常用于显示侧边栏或者补充的内容，例如：目录、索引

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool(w3cschool.cn)</title> 
</head>
<body>

<p>My family and I visited The Epcot center this summer.</p>

<aside>
<h4>Epcot Center</h4>
<p>The Epcot Center is a theme park in Disney World, Florida.</p>
</aside>

</body>
</html>
HTML5 <address> 标签

<address> 标签定义文档作者/所有者的联系信息。
<address> 元素的文本通常呈现为斜体。大多数浏览器会在该元素的前后添加换行。

HTML5 <b> 标签

在HTML5中，可以使用<b>标签来对某些文本实现加粗的效果

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool(w3cschool.cn)</title> 
</head>
<body>

<p>html5学习- <b>html5学习开始</b>.</p>

</body>
</html>

运行结果：这里写图片描述

HTML5 <base> 标签

<base>标签规定页面上所有链接的默认 URL 和默认目标：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>店铺</title>
<base href="\Downloads" target="_blank">
</head>
<body>

<p><img src="logo.png" > - 注意这里我们设置了图片的相对地址。能正常显示是因为我们在 head 部分设置了 base 标签，该标签指定了页面上所有链接的默认 URL，所以该图片的访问地址为 "http://www.w3cschool.cn/statics/images/logo.png"</p>

<p><a href="logo.png">店铺 logo</a> - 注意这个链接会在新窗口打开，即便它没有 target="_blank" 属性。因为在 base 标签里我们已经设置了 target 属性的值为 "_blank"。</p>

</body>
</html>
HTML5 <blockquote> 标签

<blockquote> 标签定义摘自另一个源的块引用。
浏览器通常会对 <blockquote> 元素进行缩进。
提示和注释
提示：如果标记是不需要段落分隔的短引用，请使用 。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>W3Cschool(w3cschool.cn)</title> 
</head>
<body>

<h1>标签</h1>
<p>这是一个html标签:</p>

<blockquote cite="https://www.w3cschool.cn">
欢迎学习html5的标签blockquote</blockquote>

</body>
</html>

运行结果这里写图片描述

HTML5 <br />标签

HTML5 <br> 标签用来对文档的文本进行换行

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>换行</title> 
</head>
<body>

<p>
我<br>今天<br>学习了<br>换行标签。
</p>

</body>
</html>

运行结果为：
我
今天
学习了
换行标签。

HTML5 <button> 标签

Html5 <button> 标签用来定义按钮。内容即是按钮的内容

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>按钮</title> 
</head>
<body>

<button type="button" onclick="alert('Hello world!')">Click Me!</button>

</body>
</html>

运行结果：这里写图片描述

HTML5 <bdo> 标签

<bdo> 标签覆盖默认的文本方向。
dir属性 必须定义文本的方向，即ltr 或者rtl

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>方向覆盖</title> 
</head> 
<body>

<p>该段文字从左到右显示。</p>
<p><bdo dir="rtl">该段落文字从右到左显示。</bdo></p>  

</body>
</html>

运行结果为：
该段文字从左到右显示。

该段落文字从右到左显示。

HTML5 <col> 标签

HTML5 <col>标签控制表格中的列，方面控制列的样式

HTML5 <colgroup> 标签`

<colgroup> 标签用于对表格中的列进行组合，以便对其进行格式化。

HTML5 <caption> 标签

<caption> 标签定义表格的标题。
<caption> 标签必须直接放置到 <table> 标签之后。
您只能对每个表格定义一个标题。

HTML5 <em> <strong> <dfn> <code> <samp> <kbd> <var> <cite> 标签

这里写图片描述

HTML5 <ul> 标签

<ul> 定义无序列表

HTML5 <dl> 标签

<dl> 标签定义一个描述列表。
<dl> 标签与 <dt> （定义项目/名字）和 <dd> （描述每一个项目/名字）一起使用。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>标签</title> 
</head>
<body>

<dl>
  <dt>巧克力</dt>
  <dd>黑色的巧克力</dd>
  <dt>豆浆</dt>
  <dd>白色的冷饮</dd>
</dl>

</body>
</html>

运行结果为：
这里写图片描述

HTML5 <del> 标签

<del> 标签定义文档中已删除的文本。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>标签</title> 
</head>
<body>

<p>欢迎 <del>你们</del> <ins>来到北京</ins>!</p>

</body>
</html>

运行结果为：这里写图片描述

紫宇轩
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
低版本浏览器不支持HTML5标签怎么解决？
Hemx的博客
08-13 2943
方式一： 一 、让IE8支持HTML5标签 首先IE浏览器对于H5的标签是不支持的，这里先下载一个html5.js，添加到自己的工作目录里，在head标签里引入就可以了。 <!--[if lt IE9]> <script src="/js/html5.js"></script> <![endif]--> /*html5*/ article,aside,dialog,footer,header,section,footer,nav,figure,menu{
html5 标签
12-14
W3C 在 2008年 1 月 22 日发布了最新的 HTML 5 工作草案。HTML 5 工作组包括 AOL, Apple, Google, IBM, Microsoft, Mozilla, Nokia, Opera 以及数百个其他的开发商。HTML 5 中的一些新特性：嵌入音频、视频、图片的...
HTML5 标签汇总
无
06-16 1万+
文档结构   html页面的基本结构如下，其中head为页面的头部信息，body为页面的主体信息。 <!DOCTYPE html> <html lang="zh-CN"> <head></head> <body></body> </html> 文档元素 DOCTYPE   DOCTYPE 即文档类型（document type），用于声明当前文档类型，告知浏览器使用哪种HTML版本（<!DOCTYPE htm.
HTML5标签&&属性全在这里了
Rice_w的博客
03-23 7531
一、HTML5文档结构 HTML5文档的基本结构 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>我的第一个网页</title> </head> <body> Hello World！ </body> </html> <!DOC
HTML5 标签大全
郎涯技术
09-07 1万+
基础 标签 描述   定义文档类型。 定义 HTML 文档。 定义文档的标题。 定义文档的主体。 to 定义 HTML 标题。 定义段落。 定义简单的折行。 定义水平线。 定义注
HTML5 标签大全笔记，用到的时候翻一下，百度都省了！
热门推荐
龙叔的博客
08-24 2万+
HTML标签大全，前端方向必备
HTML5 基础标签
m0_73070900的博客
08-04 2523
当今互联网时代，网页是我们获取信息、交流和展示自己的重要渠道之一。而HTML（超文本标记语言）作为构建网页的基础，学习掌握HTML标签成为了必不可少的技能。
HTML5常用基础标签
weixin_53414403的博客
05-11 3410
HTML5中的标签众多，有时新手刚入门前端很容易步入误区，即想要一把抓掌握所有的知识，其实全部掌握效果不尽人意，相反会让我们学习受挫，效率低下，因此“片面”的学习有助于我们提高学习效率等，对于一些不常用的标签或者知识即查即用。因此都是有哪些常用的基础HTML5标签呢？快来看看吧！ 1.首先是一些重要的文本标签，辟如<div>、<span>、<p>、<h1-h6>、<br>、<hr>、<pre>等等 以下是依据官方解释以及
html5 常用标签的使用
baipenggui_bo
08-03 4852
什么是HTML? HTML 指的是超文本标记语言:HyperTextMarkupLanguage HTML 不是一种编程语言，而是一种标记语言 标记语言是一套标记标签(markup tag) HTML 使用标记标签来描述网页 HTML 文档包含了HTML标签及文本内容 HTML文档也叫做web 页面 HTML语法骨架格式 <html> 根标签，页面中最大的标签 <head> 头部，head标签中必须要设置的标签是title ...
HTML5 之 Fieldset 标签
无
08-17 9135
概述   fieldset 用于对表单中的控件元素进行分组。   fieldset是块级双标签，绝大多数浏览器都支持。 属性 disabled   fieldset的所有子代控件均会继承，即不可编辑状态。 <form method="post" action="http://www.baidu.com"> <div> <label for="username">用户名</label> <input type="text" name=.
HTML5 之 A 标签
无
06-18 8051
概述   a 元素可通过其href属性创建指向其他网页、文件、同一页面内的位置或其他URL的超链接。   其基本属性及含义如下。 href：链接目标的URL hreflang：指定目标URL的语言 rel：指定当前文档和被链接文档的关系 target：指定打开目标URL的方式 media：指定目标URL的媒体类型 type：指定目标URL的 MIME 类型 download：指示浏览器下载URL 链接样式   在浏览器中a标签的默认样式带有下划线，其状态和颜色如下。 link：未访问状态，字体颜色为.
HTML5标签大全
09-27
本文将详细探讨HTML5中的标签大全，包括可以省略的标签和新增的标签。 首先，我们来看看可以省略的标签。在HTML5中，一些标签允许省略开始或结束标签，以简化代码并提高效率。例如，`area`、`base`、`br`、`col`、`...
HTML5标签小集
09-28
以下是一些重要的HTML5标签及其用法： 1. `<meta>`：元数据标签，用于设置页面的基本信息，如字符编码、描述、关键词等。`content`属性用于设置具体值，`name`属性定义元数据类型，`scheme`则用于指定元数据的格式...
详解HTML5布局和HTML5标签
01-18
一、新的文档类型声明...a，新增的HTML5标签-结构标签 结构标签：(块状元素) 有意义的div   标记定义一篇文章   标记定义一个页面或一个区域的头部  <nav> 标记定义导航链接   标记定义一个区域  <aside> 标
蓝桥杯单片机竞赛-超声波测量显示
08-04
博客地址：https://blog.csdn.net/weikangcekong/article/details/140906931?spm=1001.2014.3001.5501
高等教育计算机网络基本知识
08-04
高等教育计算机网络基本知识
shapely-2.0.5-cp310-cp310-macosx_11_0_arm64.whl
最新发布
08-04
shapely-2.0.5-cp310-cp310-macosx_11_0_arm64.whl
红外传感器在 障碍物探测应用 中的抗干扰 问题摘自配件手册.pdf
08-04
红外传感器在 障碍物探测应用 中的抗干扰 问题摘自配件手册.pdf
小米商城.rar
08-04
小程序的设计源码通常包含多个文件和文件夹，组织结构清晰，以便开发者能够快速上手并进行定制化开发。主要文件和文件夹包括： 页面文件夹：存放小程序的各个页面，每个页面通常由.wxml、.wxss、.js和.json文件组成。WXML文件负责页面的结构，类似于HTML；WXSS文件负责样式，类似于CSS；JS文件负责页面的逻辑和交互；JSON文件用于页面的配置，如导航栏标题等。 组件文件夹：存放可复用的UI组件。组件与页面类似，也由.wxml、.wxss、.js和.json文件组成。通过组件化设计，可以提高代码的复用性和维护性，减少重复工作。 静态资源文件夹：存放图片、音频、视频等静态资源，便于在小程序中引用。这些资源通常放在一个名为assets或static的文件夹中。 配置文件：小程序的根目录下通常有一个app.json文件，用于全局配置，如页面路径、导航栏样式、底部Tab栏等。此外，还有app.wxss和app.js文件，分别用于全局样式和全局逻辑。 工具文件夹：存放一些工具函数和库文件，便于在小程序中调用。这些文件通常放在一个名为utils的文件夹中。
HTML5标签与属性详解：入门到精通
"html5标签属性及使用方法教程" 在HTML5中，标签和属性的使用是构建网页结构和实现交互性的重要组成部分。本教程聚焦于HTML5的标签和属性，帮助初学者快速掌握网页制作的基本技能，同时也为高级开发者提供了一个...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值