B2主题美化:首页四格

B2主题美化,效果图:

首先要先在后台添加模块,记得把移动端选择隐藏,再选择广告位,把下面的代码放进去,里面的内容需要自己修改

<div class="home-first-screen">
<div class="parts row">
<div class="col-sm-6 col-md-8 part-first">
<div class="home-first-part home-menus">
<ul>
<li><a href="https://www.dayouliao.com/zy/" target="_blank"><svg class="icon" aria-hidden="true"> <use xlink:href="#zmtupian"></use> </svg><span>套图打包</span></a></li>
<li><a href="https://www.dayouliao.com/zy/" target="_blank"><svg class="icon" aria-hidden="true"> <use xlink:href="#zmVIsheji"></use> </svg><span>素材打包</span></a></li>
<li><a href="https://www.dayouliao.com/zy/" target="_blank"><svg class="icon" aria-hidden="true"> <use xlink:href="#zmPPTyanshi"></use> </svg><span>PPT打包</span></a></li>
<li><a href="https://www.dayouliao.com/zy/" target="_blank"><svg class="icon" aria-hidden="true"> <use xlink:href="#zmzitiyangshi"></use> </svg><span>字体打包</span></a></li>
<li><a href="https://www.dayouliao.com/zy/" target="_blank"><svg class="icon" aria-hidden="true"> <use xlink:href="#zmchengjishouji"></use> </svg><span>资源转存</span></a></li>
<li><a href="https://www.dayouliao.com/zy/zygx" target="_blank" rel="nofollow"><svg class="icon" aria-hidden="true"> <use xlink:href="#zmhuabanfuben"></use> </svg><span>资源共享</span></a></li>
</ul>
</div>
</div>
<div class="col-sm-6 col-md-8">
<div class="home-first-part home-subjects">
<h2 class="hf-title"><strong><a href="https://www.dayouliao.com/zy/" target="_blank">论坛交流</a></strong>
<span>行业交流一起进步</span>
<a href="https://www.dayouliao.com/zy/" target="_blank" class="more">more</a></h2>
<div class="items">
<div class="row">
<div class="col-xs-6">
<a href="https://www.dayouliao.com/zy/" target="_blank"><span class="thumb" style="background-image:url(
https://img.dayouliao.com/2020/01/11580e4238a1c5.jpg)"><img src="
https://img.dayouliao.com/2020/01/11580e4238a1c5.jpg" alt="thumb"></span><strong class="title">百度下载不限速神器</strong></a>
</div>
<div class="col-xs-6">
<a href="https://www.dayouliao.com/zy/" target="_blank"><span class="thumb" style="background-image:url(
https://img.dayouliao.com/2020/01/12510a6c8ce15a.jpg)"><img src="
https://img.dayouliao.com/2020/01/12510a6c8ce15a.jpg" alt="thumb"></span><strong class="title">商业APP界面设计</strong></a>
</div>

</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-8">
<div class="home-first-part home-topics">
<h2 class="hf-title"><strong><a href="https://www.dayouliao.com/zy" target="_blank">商业字体</a></strong>
<span>商业英文字体下载</span>
<a href="https://www.dayouliao.com/zy" target="_blank" class="more">more</a></h2>
<div class="items">
<div class="row">
<div class="col-xs-6">
<a href="https://www.dayouliao.com/zy" target="_blank"><span class="thumb" style="background-image:url(https://img.dayouliao.com/2020/01/11e71c8a405f07.jpg)"><img src="https://img.dayouliao.com/2020/01/11e71c8a405f07.jpg" alt="thumb"></span><strong class="title">商用艺术英文字体</strong></a>
</div>
<div class="col-xs-6">
<a href="https://www.dayouliao.com/zy" target="_blank"><span class="thumb" style="background-image:url(https://img.dayouliao.com/2020/01/11ed2385c1f5c7.jpg)"><img src="https://img.dayouliao.com/2020/01/11ed2385c1f5c7.jpg" alt="thumb"></span><strong class="title">无衬线英文字体下载</strong></a>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-8">
<div class="home-first-part home-course">
<h2 class="hf-title"><strong><a href="https://www.dayouliao.com/zy/" target="_blank">快速通道</a></strong>
<span>便捷服务</span>
<a href="https://www.dayouliao.com/zy/" target="_blank" class="more">more</a></h2>
<div class="courses">
<div class="course-items">
<ul>
<li><a href="https://www.dayouliao.com/zy/vips" target="_blank" rel="nofollow"><strong>推荐升级成为高级会员</strong><span>升级会员</span></a></li>
<li><a href="https://www.dayouliao.com/zy/verify" target="_blank" rel="nofollow"><strong>领域名人申请认证服务</strong><span>达人认证</span></a></li>
<li><a href="https://www.dayouliao.com/zy/write" target="_blank" rel="nofollow"><strong>帮助别人也是一种快乐</strong><span>快速投稿</span></a></li>
<li><a href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=gOTh_e-17Onh78Dx8a7j7_0" target="_blank" rel="nofollow"><strong>需要我们改进的欢迎来信</strong><span>意见反馈</span></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>

再把下面的CSS代码放在子主题style.css文件中

给TA买糖
共{{data.count}}人
人已赞赏
wordpress教程站内网站建设

代码实现柒比贰B2主题外部链接隐藏并链跳转功能

2020-2-1 2:09:19

wordpress

JS实现网站运行X天X小时X分X秒与倒计时时间特效

2020-2-1 3:04:24

⚠️
Golurending上的部份代码及教程来源于互联网,仅供网友学习交流,未经Golurending作者或上传书面授权,请勿作他用。
若您的权利被侵害,请联系站长 邮箱codesns#163.com(#-@) 或 点击右侧 私信:管理员 反馈,我们将尽快处理。
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索