在wordpress中的“自定义HTML”小工具中加入相应源码,将其放置在合适的位置即可。如下图:
源码如下(可随意更改自己喜欢的颜色):
<html>
<head>
<title>友情链接</title>
<meta name="referrer" content="no-referrer">
<style type="text/css">
.all{margin:3px;width:1010px; height:40px;}
.all .bll{width:150px; height:10px;float:left;margin-left:10px;}
.all .bll .list{
border-radius:5px;
padding:3px 0px 3px 0px;/*数值顺序:上 右 下 左*/
text-align:center;
color:White;
font-size:14px;
font-family:微软雅黑;
}
.all .bll .backc11:hover{-moz-box-shadow: 5px 5px 5px #888888;box-shadow: 5px 5px 5px #888888;}
.all .bll a{text-decoration:none;}
.backc11{ background-color:#669999;border:2px solid #4D7373;}
.img_wrap{
width: 16px;
height: 16px;
border: 0px dashed #ccc;
vertical-align: -15%;
text-align: center;
}
</style>
</head>
<body>
<div class="all">
<div class="bll"><a target="_blank" href="http://www.splsys.com"><div class="list backc11"><img class="img_wrap" src="https://f.ydr.me/www.splwl.com" width="16" height="16" /> 斯普林网络</div></a></div>
<div class="bll"><a target="_blank" href="http://www.whyoho.com"><div class="list backc11"><img class="img_wrap" src="https://f.ydr.me/www.whyoho.com" width="16" height="16" /> 悠活网</div></a></div>
</div>
</body>
</html>