html中footer页脚标签的详细介绍

原创 国哥笔记  2019-04-23 19:57  阅读 482 views 次

本篇将介绍的是html中<footer>页脚标签的用法,有兴趣的朋友可以学习一下!

在html5版本中,新增了很多语义化的标签,这些语义化标签对内容是没有样式效果的,它们只是起到语义化的作用。比如:<header>、<nav>、<aside>、<footer>等标签,今天要介绍的就是其中之一,即<footer>标签。

“footer”作为英文单词有“页脚”的意思,那作为html中的标签又有什么意思呢?接下来我们一起来看看吧!

一、<footer>标签的定义及用法

在html中,<footer>标签是html5新增的语义化标签,是使用来定义文档或节的页脚。它只起到语义的作用,默认对内容是没有任何样式效果的,如果要添加样式,一般是使用css来实现;

一个网页中可以使用多个<footer>标签,<footer>标签一般是表示文档或者文档的一部分区域的页脚,应该包含它所包含的元素的信息。比如创作者的姓名、文档的创作日期以及创作者的联系信息等;

在使用的时候,可以将<footer>标签当作<div>标签来使用,但是要考虑到<footer>标签的语义,一般在一个网页中页面底部的时候才使用;

二、<footer>标签语法格式

<footer id="footer">页脚内容<footer>

说明:

  1. <footer>标签中的内容默认是没有任何样式效果的,和<div>标签的效果一样,只是语义不一样;
  2. <footer>标签支持html全局属性以及全局事件,通常css会通过标签的id属性来更改它的样式;

三、实例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>html中footer页脚标签的详细介绍</title>
</head>
<body bgcolor="bisque">
<section><p>这是一个段落</p></section>
<footer>
<p>2019 百家号</p>
<p>Posted by: 编程的乐趣百家号</p>
</footer>
</body>
</html>

运行结果:

footer标签演示

好了,关于html中<footer>标签的介绍就结束了,希望能帮助大家!

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

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

发表评论


表情