-
公司的官网底部大多都有友情链接,一下代码为简单底部布局,仅供初学者参考。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>底部友情链接</title> <style type="text/css"> /*通用开始*/ * { margin: 0; padding: 0; font-family: '微软雅黑', Arial, Helvetica, sans-serif; } a { text-decoration: none; } img { border: none; } li { list-style: none; } body { font-size: 12px; } div { font-size: 12px; } span { font-size: 12px; } /*通用结束*/ .footer { background: #2b2e33; } .footer .alt { overflow: hidden; padding: 20px 0; width: 1160px; margin: auto; } .footer .alt .foot { width: 138px; float: left; } .footer .alt .foot p { color: #FFF; line-height: 28px; } .footer .alt .foot a { color: #999; display: block; line-height: 24px; } .footer .alt .foot a:hover { color: #CCC; } .footer .alt .foot img { padding-top: 20px; } </style> </head> <body> <div class="footer"> <div class="alt"> <div class="foot"> <p>关于我们</p> <a href="###">企业简介</a> <a href="###">企业文化</a> <a href="###">组织机构</a> <a href="###">发展历程</a> <a href="###">企业荣誉</a> <a href="###">诚聘英才</a> <a href="###">联系我们</a> </div> <div class="foot"> <p>新闻中心</p> <a href="###">公司新闻</a> <a href="###">行业新闻</a> </div> <div class="foot"> <p>产品及解决方案</p> <a href="###">产品系列</a> <a href="###">解决方案</a> </div> <div class="foot"> <p>研发与创新</p> <a href="###">核心技术</a> <a href="###">技术创新</a> </div> <div class="foot"> <p>经典案例</p> <a href="###">智慧城市</a> <a href="###">智慧高速</a> <a href="###">智慧家居</a> <a href="###">智慧网络</a> </div> <div class="foot"> <p>服务支持</p> <a href="###">技术支持</a> <a href="###">服务网络</a> <a href="###">资料下载</a> <a href="###">公司理念</a> </div> <div class="foot"> <p>关注我们</p> <img src="http://placehold.it/82x82" /> </div> </div> <div style="border-top:1px #1F1F1F solid;"> <p class="alt" style="color:#999; line-height:0;">@ 版权所有:郑州鬼谷青龙实业有限公司 <span>技术支持:</span> <a href="###" target="_blank" style="color:#999;">河南鬼谷子科技公司</a> <span style="float:right;">地市:郑州市轩辕区摩天大厦大厦99楼</span> </p> </div> </div> </body> </html>
效果如下:
来源:酷米社区(关注电脑技术和资源分享的博客)转载请保留此处和链接!
地址:http://www.kumi6.com/?id=100
常见网站底部友情链接代码示例
668人参与 |分类: 网页代码|时间:2019年03月12日 21:08
相关文章阅读更多:代码
- 2020-02-25鼠标点击显示 爱心JS代码
- 2019-12-29jQuery高级在线配色器插件
- 2019-11-24图片无限滚动代码
- 2019-04-06HTML超级搜索网站源码下载|淘宝客搜索引擎源码(调用淘宝特卖)
- 2019-04-06淘宝搜索框代码
- 2019-04-04网站代码怎么看?找某某视频的源地址?基础知识
- 2019-04-04分享10种常见的网页编程.js代码,可以直接在自己网页中用
- 2019-04-04空调显示的这些代码,是什么意思?
- 2019-03-28JS实现部分HTML固定页面顶部随屏滚动效果
- 2019-03-17查找php配置文件php.ini所在路径的二种方法
发表评论酷米社区