近日去一些博客闲逛,发现他们的博客底部的页脚导航菜单是三栏要比知更鸟Begin主题5.2版本自带的两栏要好看,心里痒痒,经过一番折腾终于美化成功,效果见下图:
代码部署:
- /** 页脚小工具 **/
- #footer-widget-box {
- background: #555;
- position: relative;
- padding: 10px 0;
- box-shadow: 0 -1px 1px rgba(0, 0, 0, 0.1);
- }
- .footer-widget {
- width: 1120px;
- margin: 0 auto;
- }
- .footer-widget h3 {
- font-size: 15px;
- color: #ccc;
- margin: 15px 0 0 0;
- }
- .footer-widget .widget {
- background: #555;
- float: left;
- width: 33.33333333333%;
- padding: 0 20px;
- border: none;
- box-shadow: none;
- }
- .footer-widget, .footer-widget a {
- color: #ccc;
- }
- .footer-widget a:hover {
- color: #fff;
- }
- .footer-widget .widget ul {
- padding: 8px 0 15px;
- }
- .footer-widget .menu li {
- float: left;
- width: 50%;
- }
- #footer-widget-box .add-widgets, #footer-widget-box .add-widgets a {
- color: #fff;
- text-align: center;
- }
代码修改:
效果图:
- 我的微信
- 微信扫一扫
-
- 我的微博
- 微博扫一扫
-
评论