html5 footer标签怎么用?footer标签的用法实例

本篇文章主要的为大家介绍了关于HTML5 footer标签的使用方法,有布局之类的知识,纯html编辑,不需要会css,好了,现在让我们来看看这篇关于html5 footer标签的文章吧

首先我们先看看html5 footer标签的使用:

HTML5 <footer>标签元素 新增html5底部footer元素标签,对html 5新增footer标签基础认识到了解footer css布局教程做到真正掌握与认识<footer>

记得我们在以前html5版本以前布局网页底部版权时,习惯使用id=”footer”或class=”footer”。了解更多html教程标签!

比如传统html布局代码:

<div id=”footer”> 
  © 编程之家 版权所有<br /> 
  学习html,找DIV+CSS资源上编程之家! 
</div>

但在html5中将此”footer”常用的命名新增为html5元素标签成员。

html5 footer标签的语法:

<footer> 
  © 编程之家 版权所有<br /> 
  学习html,找DIV+CSS资源上编程之家! 
</footer>

小知识扩展:

我们在html5开发使用footer标签时,把当作普通div标签对待即可,只不过一般用于网站底部布局。一般情况下一篇网页只有一个底部区,所以使用最好只使用一次footer即可。

需要注意:<footer>是html5新增的,在IE8及以下IE浏览器不兼容,谨慎使用。

html5 footer使用布局案例:

通过传统div标签布局与footer标签布局对比观察学习,从而掌握footer标签。完整HTML5布局实例代码:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>footer 编程之家在线演示</title> 
</head> 
<body> 
<p>传统html 使用div布局</p> 
<div id="footer"> 
  © 编程之家 版权所有<br /> 
  学习html,找DIV+CSS资源上编程之家! 
</div> 
<p>html5 footer标签布局</p> 
<footer> 
  © 编程之家 版权所有<br /> 
  学习html,找DIV+CSS资源上编程之家! 
</footer> 
</body> 
</html>

效果如图所示:

tuyi.png

好了,到这,这篇关于HTML5 footer标签的文章就结束了(想学更多就来编程之家,里面有你所有想要的在线编程课程),有疑问可以在下方留言

【小编推荐】

html中的head标签在哪里找?head标签的作用总结

html frame标签怎么使用?frame标签的用法介绍(附实例)

以上就是html5 footer标签怎么用?footer标签的用法实例的详细内容,更多请关注编程之家其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码
HTML5使用DOM进行自定义控制
使用HTML5 Canvas绘制阴影效果的方法
使用PHP和HTML5 FormData实现无刷新文件上传
如何解决HTML5 虚拟键盘出现挡住输入框的问题
HTML5中div和section以及article的区别分析
html5和CSS 实现禁止IOS长按复制粘贴功能
html5 touch事件实现触屏页面上下滑动
canvas 模拟实现电子彩票刮刮乐的代码
HTML5 Plus 实现手机APP拍照或相册选择图片上传的功能
Android自定义环形LoadingView效果
HTML5 canvas绘制五角星的方法
html5使用html2canvas实现浏览器截图
使用Canvas处理图片的方法介绍
利用Canvas模仿百度贴吧客户端loading小球的方法