WordPress 主题美化 – 底部菜单美化
底部菜单美化的 css 代码如下:
/** 底部菜单美化 */
.menu-footer-list {
display: inline-block;
border-radius: 4px;
text-shadow: none;
font-size: 12px;
color: #fff !important;
line-height: 15px;
margin-bottom: 5px;
}
.menu-footer-list .menu-item a {
color: #fff !important;
font-size: 13px;
}
.menu-footer-list .menu-item{
display: inline-block;
background-color: #4d4d4d;
padding: 4px 4px 4px 6px;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
margin-right: 5px;;
}
.menu-footer-list li:nth-child(6n+1) {
background-color: #4dc820;
}
.menu-footer-list li:nth-child(6n+2) {
background-color: #8833d7;
}
.menu-footer-list li:nth-child(6n+3) {
background-color: orange;
}
.menu-footer-list li:nth-child(6n+4) {
background-color: #e91515;
}
.menu-footer-list li:nth-child(6n+5){
background-color: #007ec6;
}
.menu-footer-list li:nth-child(6n) {
background-color: #e323c2;
}
#menu-footer-nav li:hover {
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
}
共有 0 条评论