为下载的迅睿cms模板前端增加友情链接版块
我们一直在坚持不懈地努力,帮助新手小白更加方便的进行WEB应用的快速开发,如果您对我们的成果表示认同,并且觉得对你有所帮助。我们愿意接受来自各方面的捐赠^_^,您的帮助是对我们的支持和动力!
有时候在平台遇到很喜欢的模板,但是模板前端没有友情连接板块,如果有一定前端基础的朋友,可以自己新增一个板块调用友情连接。不懂前端或者懒得写的朋友,可以使用本篇教程分享的迅睿cms模板前端增加友情连接板块的通用代码。
HTML前端代码
将以下HTML代码复制粘贴到首页模板文件(index.html)的</body>前面即可。
<div class="link_box">
<div class="container"> <span class="link_title">友情链接</span>
<span class="link_list">
<?php $mysite=dr_site_value('yqlj');?>
{php $mval = $mysite;}
{loop $mval $v}
<a href="{$v[2]}" target="_blank">{$v[1]}</a>
{/loop}
</span>
</div>
</div>CSS样式代码
将以下CSS样式代码复制粘贴到首页调用的任意CSS样式文件中即可。
/*友情链接板块样式*/
.link_box{
background-color: #000000;
padding: 20px 0px 20px 0px;
text-align: center;
color: #fff;
font-size: 13px;
}
.link_box a{
color: #fff;
padding:0px 0px 0px 10px;
font-size: 13px;
text-decoration: none;
}
.link_box a:hover{
text-decoration: none;
color:#002B57;
}
.link_title{
font-size: 13px;
margin-right: -6px;
}
.link_title:after{
content:":";
}
/* 移动端隐藏友情连接板块 */
@media only screen and (min-width: 320px) and (max-width: 991px) {
.link_box{
display: none;
}
}温馨提示
实际可根据模板调整代码位置和css样式代码,以呈现更好的视觉效果。
我们一直在坚持不懈地努力,帮助新手小白更加方便的进行WEB应用的快速开发,如果您对我们的成果表示认同,并且觉得对你有所帮助。我们愿意接受来自各方面的捐赠^_^,您的帮助是对我们的支持和动力!
声明:禁止复制、盗用、采集、发布本站内容到任何网站及各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。





