html中fieldset标签详细介绍

原创 国哥笔记  2019-04-23 20:06  阅读 452 views 次

本篇将介绍的是html中figure标签和figcaption标签的用法,有兴趣的朋友可以学习一下!

学习html就是学习标签的用法,今天将为大家介绍的是html中的figure标签和figcaption标签的用法,为什么要同时介绍这两个标签呢?原因很简单,这两个标签有一定的联系,我们一起来看看这两个标签的具体用法吧!

“figure”作为英文单词有很多意思,就是找不到一个和它作为标签意思相近的翻译,大家是否知道,它应该翻译成什么意思才适合;

“figcaption”是“figure caption”简写,有“图形标题”的意思,和它作为html中标签的意思相当;

一、figure标签和figcaption标签的定义及用法

在html中,figure标签和figcaption标签都是html5中新增的标签。figure标签是使用来定义独立的流内容,比如图像、图表、照片等,而figcaption标签是使用来为figure元素定义标题;

figure中的内容通常是与主内容相关,但又是一块独立的内容,如果把它删除,不会对网页中的其它内容产生影响;

figcaption标签一般是充当figure标签中的第一个或最后一个子元素来为figure元素定义标题;

二、figure标签和figcaption标签语法格式

<figure><figcaption>figure元素标题</figcaption>内容</figure>

或<figure>内容<figcaption>figure元素标题</figcaption></figure>

说明:figure标签中的内容可以是图片、统计图或代码示例等,通常表示一个组合,figcaption标签设置组合的标题。

三、实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>html中figure标签和figcaption标签的详细介绍</title>
</head>
<body bgcolor="bisque">
<p>这是figure标签和figcaption标签的介绍</p>
<figure>
<figcaption>figure和figcaption标签示例</figcaption>
<p>作者:编程的乐趣 时间:2019年04月21日</p>
<p>这是一段代码示例</p>
</figure>
</body>
</html>

运行结果:

figure和figcaption标签演示

好了,关于html中figure标签和figcaption标签的介绍就结束了,希望对大家有用!

更多html标签----->html标签大全

本文地址:https://www.ggbiji.com/html-fieldset-2.html
版权声明:本文为 国哥笔记 原创/整理文章,欢迎分享,转载请注明出处!

发表评论


表情