html底部的美化代码
导读：HTML底部是网页设计过程中必不可少的一个部分，如何将底部设计得美观且实用呢，下面这段HTML与CSS代码可以帮到您。联系我们地址：xx市xx区xx路xx号电话：400-xxx-xxxx邮箱：xxxx@xxx.com网站导航首页产品中心公司...
HTML底部是网页设计过程中必不可少的一个部分，如何将底部设计得美观且实用呢，下面这段HTML与CSS代码可以帮到您。
联系我们
- 地址：xx市xx区xx路xx号
- 电话：400-xxx-xxxx
- 邮箱：xxxx@xxx.com
网站导航
- 首页
- 产品中心
- 公司介绍
- 联系我们
我们在社交媒体上
©2021 xxx有限公司，保留一切权利。
footer { background-color: #3F3D4A; color: #FFFFFF; padding: 50px 0; } .wrapper { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: flex-start; } .info ul, .nav ul, .social ul { list-style: none; margin: 0; padding: 0; } .info li, .nav li, .social li { margin-bottom: 10px; } a { color: #FFFFFF; text-decoration: none; } a:hover { text-decoration: underline; } .social i { font-size: 24px; margin-right: 10px; } p { font-size: 14px; text-align: center; margin-top: 50px; margin-bottom: 0; }以上HTML与CSS代码将底部设计为三栏式，左边是联系我们的信息，中间是网站导航，右边是社交媒体链接。底部的背景色为深灰色，文字为白色，整个设计感强烈，视觉效果出众。同时在底部加上版权声明，保留公司权利。这段代码可以在现有网页中轻松应用，并提升网站美观度与用户体验感。
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： html底部的美化代码
本文地址： https://pptw.com/jishu/310497.html