本文是《推荐(共43篇)》专题的第 11 篇。阅读本文前,您可以先阅读前面的一些文章:
美化展示
第一步
添加在footer.php文件中(替换所有内容),注意自行修改其中链接
<div class="footer hidden-xs">
<div class="footer__wrapper site-info" style="margin-top: 100px;">
<div class="footer__row">
<div class="footer__column hodss footer__column-products ducts pull-left mfu-5j">
<h4>
热门资源分类
</h4>
<div class="footer__column pull-left">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3BjLw=="
class="list__link">
电脑主题
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3RhZy90dWJpYW8v"
class="list__link">
电脑图标
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3dhbGxwYXBlci8="
class="list__link">
高清壁纸
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3RhZy9jdXJzb3JzLw=="
class="list__link">
鼠标指针
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3NraW5zLw=="
class="list__link">
软件皮肤
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3dhbGxwYXBlci8="
class="list__link">
高清壁纸
</a>
</div>
<div class="footer__column pull-left">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL21vYmlsZS8="
class="list__link">
手机壁纸
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2xhYnMv"
class="list__link">
问卷调查
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3Rvb2xzLw=="
class="list__link">
美化软件
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2J1YmJsZS8="
class="list__link">
桌面秀
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3N0dWR5Lw=="
class="list__link">
美化教程
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3Rvb2xzLw=="
class="list__link">
美化软件
</a>
</div>
</div>
<div class="footer__column hodss footer__column-products pull-left mob-hide mar-2x">
<h4 data-microtip="你继续使用本站即视为理解并同意以下协议" data-microtip-position="top">
网站协议
</h4>
<div class="footer__column">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2d1aWZhbi8="
target="_blank" class="list__link">
用户规范
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3N1Lw=="
target="_blank" class="list__link">
版权声明
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2t1YW4v"
target="_blank" class="list__link">
充值协议
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL3ByaXZhY3kv"
target="_blank" class="list__link">
隐私权声明
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2NvLw=="
target="_blank" class="list__link">
授权及使用协议
</a>
</div>
</div>
<div class="footer__column hodss footer__column-company pull-left mob-hide mar-20j">
<h4>
关于我们
</h4>
<div class="footer__column">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2Fib3V0dXMv"
target="_blank" class="list__link">
关于致美化
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2NvbnRhY3Qv"
target="_blank" class="list__link">
联系方式
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly96aHV0aXguY29tL2pvaW51cy8="
target="_blank" class="list__link">
加入我们
</a>
</div>
</div>
<div class="footer__column footer__column-newsletter pull-right mar-1j">
<div style="" class="footer__row">
<div class="join join_simple">
<div class="join__form">
<form id="scbar_form" role="search" method="get" class="search-form" action="https://www.miuiy.com/"
target="_blank">
<div class="join__field field">
<div class="field__wrap">
<input type="text" name="s" placeholder="" id="s" class="pd5 field__input ng-pristine ng-untouched ng-valid ng-empty ng-valid-email"
value="">
<img src="https://www.miuiy.com/logo.png">
</div>
</div>
<button type="submit" name="post_type" sc="1" class="join__btn v6-btn"
value="post">
<i class="sai feng-sousuo2">
</i>
</button>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="footer__row">
<div class="footer__column footer__column-cta cta-author pull-left">
<a href="/qqqun/" class="btn v6-btn v6-btn_blue">
QQ群
</a>
<div class="button-cta author hodss">
<span>
加入艺创博客技术QQ群一起学习美化。
</span>
</div>
</div>
<div class="footer__column footer__column-cta cta-affiliate gzzh pull-left mar-20l">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly9zcGFjZS5iaWxpYmlsaS5jb20vMTU4MDEzOA=="
target="_blank" data-microtip="致美化哔哩哔哩空间" data-microtip-position="top-left">
<img src="https://dl.zhutix.net/2019/02/bilibili.svg">
</a>
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly93ZWliby5jb20vbWZhbjE1MQ=="
target="_blank" data-microtip="致美化新浪微博" data-microtip-position="top-right">
<img src="https://dl.zhutix.net/2019/02/weibo.svg">
</a>
<!-- <a href="/vips" class="btn v6-btn column12">申请VIP</a>
<div class="button-cta affiliate">
<span>三折抢终生会员享免锋币下载特权</span>
</div> -->
</div>
<div class="footer__column footer__column-counts pull-right">
<div class="count" data-microtip="⛔当你的锋币<1且60天内未登录网站会被自动删除账号" data-microtip-position="top-left">
<div class="number">
221679
</div>
<div class="caption">
用户数量
</div>
</div>
<div class="count">
<div class="number">
396505
</div>
<div class="caption">
互动数量
</div>
</div>
<div class="count">
<div class="number">
1332
</div>
<div class="caption">
素材数量
</div>
</div>
<div class="count hodss">
<div class="number">
18
</div>
<div class="caption">
作者数量
</div>
</div>
</div>
</div>
</div>
</div>
<div id="footer-bottom">
<div class="footer__row site-info">
<div class="footer__column copyright pull-left">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cDovL3d3dy5taWl0YmVpYW4uZ292LmNuLw=="
target="_blank" rel="external nofollow">
豫ICP备12009440号
</a>
Theme by
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly83YjIuY29t"
target="_blank">
柒比贰
</a>
<!-- 18 queries 0.128s -->
</div>
<div class="footer__column payment hodss pull-right">
<!-- <i class="sai feng-anquan1"></i>
<span>技术支持:</span> -->
<img class="icon icon-v6 icon-v6-stripe teng" src="https://dl.zhutix.net/v2.1/teng.svg"
title="腾讯云">
<img class="icon icon-v6 icon-v6-stripe ali" src="https://dl.zhutix.net/v2.1/ali.svg"
title="阿里云">
<img class="icon icon-v6 icon-v6-stripe qiniu" src="https://dl.zhutix.net/v2.1/qiniu.svg"
title="七牛云">
<img class="icon icon-v6 icon-v6-stripe youku" src="https://dl.zhutix.net/v2.1/youku.svg"
title="优酷">
<img class="icon icon-v6 icon-v6-stripe alipay" src="https://dl.zhutix.net/v2.1/alipay.svg"
title="支付宝">
<img class="icon icon-v6 icon-v6-stripe weixinpay" src="https://dl.zhutix.net/v2.1/weixinpay.svg"
title="微信支付">
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cHM6Ly92Lnl1bmFxLmNvbS9jZXJ0aWZpY2F0ZT9kb21haW49d3d3LnpodXRpeC5jb20mYW1wO2FtcDtmcm9tPWxhYmVsJmFtcDthbXA7Y29kZT05MDAzMA==">
<img class="icon11 icon-v6 icon-v6-strip" src="https://aqyzmedia.yunaq.com/labels/label_sm_90030.png">
</a>
</div>
<div class="wencom pull-left">
Copyright © 2018
<a rel="external nofollow" target="_blank" href="https://www.miuiy.com/wp-content/themes/begin/go.php?url=aHR0cDovL3podXRpeC5jb20v"
target="_blank">
zhutiX.com
</a>
<span class="hodss">
. All Rights Reserved.
</span>
</div>
</div>
</div>
第二步
样式代码放到主题目录的style.css文件内,不同主题可能会有变化(柒比贰主题放置子主题内的style.css即可)。
/*底部css代码-设计趁年华*/.footer {
border-bottom:1px solid #000;
box-sizing:border-box;
left:0;
bottom:0;
letter-spacing:.4px;
line-height:1.3;
z-index:6;
position:relative;
width:100%;
height:405px;
background:#ffffff url(https://dl.zhutix.net/2019/01/foot-bg.png) center bottom no-repeat;
}
.mar-1j {
margin-top:108px;
}
.mfu-5j {
margin-top:-28px;
}
.mar-2x {
margin-top:2px;
}
.mar-20j {
margin-top:62px;
}
.mar-20l {
margin-left:34px;
}
.footer__wrapper {
box-sizing:border-box;
margin:0 auto;
padding:85px 5px 0px;
}
.footer__wrapper>.footer__row:first-of-type {
margin-bottom:20px;
}
.pull-left {
float:left;
}
.footer__column-products {
margin-right:95px;
}
.footer h4 {
font-size:20px;
font-weight:300;
line-height:1;
color:#fff;
padding-bottom:10px;
color:#03a9f4;
border-bottom:#03a9f4 solid 1px;
margin-bottom:10px;
}
.footer__column-products .footer__column:not(:last-of-type) {
margin-right:90px;
}
.footer .list__link:hover {
color:#03a9f4;
}
.footer .list__link {
color:#979b9e;
display:block;
font-size:14px;
line-height:2.2;
padding:0;
}
.pull-right {
float:right;
}
.footer .join {
margin:12px 0 12px;
width:390px;
}
.join {
text-align:center;
}
.join__form {
position:relative;
max-width:544px;
margin:0 auto;
text-align:left;
}
.field {
position:relative;
}
.footer .join .field__wrap {
border:2px solid #33353a;
}
.field__wrap {
border-radius:5px;
}
.footer .join .field__input {
height:54px;
color:#a9a9a9;
padding:0 15px 0 58px;
}
.field__input {
border:0;
box-sizing:border-box;
width:100%;
height:64px;
padding:10px 22px 0;
background:#17181b;
border-radius:5px;
font-size:14px;
color:#fff;
}
.footer button,.footer input,.footer select,.footer textarea {
color:inherit;
font:inherit;
font-family:Microsoft YaHei;
margin:0;
outline:none;
font-size:14px;
}
.footer .join .field__wrap img {
height:30px;
left:14px;
position:absolute;
top:14px;
vertical-align:middle;
width:30px;
}
.footer .join .field__label {
padding:0 56px;
top:22px;
}
.field__label {
position:absolute;
top:25px;
padding:0 22px;
font-size:12px;
color:#adb7be;
pointer-events:none;
transition:-webkit-transform .2s;
transition:transform .2s;
transition:transform .2s,-webkit-transform .2s;
}
.footer .join .join__btn {
background:transparent;
height:38px;
right:10px;
top:2px;
width:unset;
}
.join__btn {
background:transparent;
box-sizing:border-box !important;
position:absolute;
top:22px;
right:14px;
height:46px;
padding:10px;
}
.v6-btn {
border:0;
padding:12px 20px 11px;
border-radius:4px;
color:#fff;
letter-spacing:.4px;
outline:none;
text-transform:uppercase;
font-weight:normal;
font-size:14px;
}
.footer .signup-cta {
color:#50595b;
font-size:13px;
}
.footer .social__links {
margin:15px 0 0;
}
.footer .social__links .link__container {
display:-webkit-box;
display:-ms-flexbox;
display:flex;
float:left;
-webkit-box-pack:end;
-ms-flex-pack:end;
justify-content:flex-end;
}
.link__container .feng-weibo-logo {
color:#E6162D;
}
.footer .social__link {
float:right;
}
.social__link {
margin:0 20px;
}
.footer .social__links:after {
content:"";
display:table;
clear:both;
}
.link {
margin-bottom:40px;
}
.link .t {
font-size:20px;
font-weight:300;
line-height:1;
margin:0;
margin-right:20px;
width:100%;
}
.link li {
float:left;
margin:20px 0;
padding:8px;
}
.link li a {
color:#adb7be;
}
.footer__wrapper>.footer__row:nth-of-type(2) {
border-top:#2e2e2e solid 1px;
padding:30px 0;
}
.footer__wrapper>.footer__row {
width:100%;
}
.footer__column-cta.cta-author {
margin-right:60px;
}
a.v6-btn {
display:inline-block;
}
.v6-btn_blue {
background:#03a9f4 !important;
}
.footer .button-cta.author {
max-width:110px;
}
.footer .button-cta span,.caption {
font-size:12px;
line-height:1.6;
}
.footer .button-cta.affiliate {
max-width:120px;
}
.footer .button-cta {
color:#50595b;
display:-webkit-inline-box;
display:-ms-inline-flexbox;
display:inline-flex;
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
-ms-flex-direction:column;
flex-direction:column;
height:38px;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
margin-left:14px;
vertical-align:middle;
}
.footer__wrapper>.footer__row:after {
content:"";
display:table;
clear:both;
}
.footer__column-counts .count:first-of-type {
margin-left:0 !important;
}
.footer__column-counts .count {
float:left;
margin-left:60px;
}
.footer__column-counts .count .number {
font-size:20px;
line-height:1;
margin-bottom:6px;
color:#d6d6d6;
}
.footer__column-counts .count .caption {
color:#50595b;
line-height:1;
}
.footer__wrapper>.footer__row:last-of-type {
margin-top:25px;
}
.footer__wrapper>.footer__row {
width:100%;
}
.copyright,.copyright a,.footer .copyright {
color:#50595b;
font-size:13px;
}
.wencom,.copyright {
margin-bottom:10px;
}
.wencom {
width:100%;
color:#50595b;
font-size:13px;
}
#footer-bottom .payment .icon-v6-lock {
margin-right:6px;
margin-top:-3px;
}
#footer-bottom .payment .icon {
height:16px;
vertical-align:middle;
}
#footer-bottom .icon-v6-stripe.alipay {
width:50px;
height:auto;
}
#footer-bottom .payment .icon-v6-stripe {
margin-left:30px;
}
.column12 {
border:2px #ff5d8f solid !important;
color:#ff5d8f !important;
}
#footer-bottom .payment .icon-v6-stripe.weixinpay {
width:62px;
height:auto;
}
#footer-bottom:after,.footer:after {
content:"";
display:table;
clear:both;
}
#footer-bottom .payment span {
font-size:14px;
}
.link__container i {
font-size:30px;
}
.join__form .feng-sousuo2 {
font-size:24px;
color:#a9a9a9;
}
.wencom a {
color:#00e500;
}
@media screen and (max-width:1200px) {
.ducts {
display:none;
}
}@media screen and (max-width:900px) {
.hodss {
display:none;
}
.join__form {
max-width:100%;
}
.footer .join {
width:100%;
}
.wencom {
margin-bottom:30px;
}
.footer__column-newsletter {
float:left;
}
.footer__column-newsletter,.cta-affiliate {
margin-left:10px;
}
.cta-author {
height:70px;
margin-left:10px;
}
}#footer-bottom .icon11 {
height:35px;
margin-left:30px;
margin-top:-6px;
filter:grayscale(1);
}
#footer-bottom .icon11:hover {
filter:grayscale(0);
}
#footer-bottom {
bottom:0;
left:0;
border-top:1px solid #444;
letter-spacing:.4px;
line-height:1.3;
z-index:2;
width:100%;
background:url(https://dl.zhutix.net/2018/11/footer_bottom_bg.png) repeat-x left bottom #000;
padding:25px 0 25px 0;
overflow:hidden;
position:relative;
}
.gzzh img {
height:43px;
margin-right:50px;
}