推荐使用语义化footer标签添加页脚，结构清晰且利于SEO；基本用法为<footer>版权信息</footer>；结合CSS可设置样式与定位，如fixed固定底部或static随内容布局；通常置于body最后，也可用于article等内部区块标注元信息。
在HTML中添加页脚，推荐使用语义化的 footer 标签。它不仅结构清晰，还对搜索引擎和辅助设备更友好。页脚通常包含版权信息、联系方式、导航链接或备案号等内容。
直接在页面底部插入 <footer></footer> 标签即可：
<footer> <p>© 2024 我的网站. 版权所有。</p> </footer>
为了让页脚更好看，可以配合CSS设置位置、背景色、文字居中等效果：
<style>
footer {
background-color: #333;
color: white;
text-align: center;
padding: 20px;
width: 100%;
position: fixed; /* 固定在底部 */
bottom: 0;
left: 0;
}
</style>
<p><footer>
<p>联系我们：contact@example.com</p>
</footer>
说明：使用 position: fixed 可让页脚始终显示在浏览器底部；若希望页脚随内容自然排列，可改为 position: static 或省略定位属性。
立即学习“前端免费学习笔记（深入）”；
一般将 footer 放在 <body> 的最后，作为页面结构的收尾：
<body>
<header>网站头部</header>
<main>主要内容区域</main>
<footer>
<p>京ICP备12345678号</p>
</footer>
</body>
虽然一个页面通常只有一个主页脚，但 footer 也可用于文章或区块内部：
<article>
<h2>博客文章标题</h2>
<p>文章内容...</p>
<footer>
<small>发布于 2024年4月1日</small>
</footer>
</article>
这种用法适合为独立内容块添加元信息。
基本上就这些。合理使用 footer 标签，能让网页结构更清晰，维护也更方便。不复杂但容易忽略细节。
以上就是HTML页脚怎么添加_HTML页脚footer标签设置的详细内容，更多请关注php中文网其它相关文章！
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
广告Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
803
收藏
