忘了之前在哪里看到了,回头找到原文地址,再加上

思路是这样的,page页面,按格式填入代码:

友情链接的代码如下:

然后页面js会把这些内容隐藏掉,然后通过js去分配每一个支点,然后重新打造新的友情链接的列表

演示看这里:https://www.veimoz.com/links.html

js代码如下:

 

css样式代码,放到主题的样式表就可以了

.post-lists { position: relative;  display: block;overflow: hidden;}  
.post-list-item { float: left;  width: 33.3333%; height: auto; padding: 15px;  align-items: center;}
.post-list-item .item-title{font-size: 18px;}
.post-list-item a{ color: #fff; border-bottom: 0px solid #00000070;} 
.post-list-item-container { position: relative; overflow: hidden;  width: 100%; padding: 0; border-radius: 3px;  background-color: #fff; -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.04); box-shadow: 0 1px 4px rgba(0,0,0,.04);}
.post-list-item-container .item-label { position: relative;  height: 130px; padding: 25px 20px 40px; background-color: #fff;}
.post-list-item-container .item-label.bg-purple .item-title a { color: #fff;}
.post-list-item-container .item-label .item-meta {  position: absolute; right: 0; bottom: 0;  width: 100%;  padding: 0 15px 15px;  text-align: right;}
.post-list-item-container .item-label .item-meta .item-meta-ico {  display: inline-block;  float: right; width: 42px;  height: 42px; border: 1px solid #eaeaea;  border-radius: 50%;}
.post-list-item-container .item-label.bg-purple .item-meta .item-meta-date { color: #fff;}
.post-list-item-container .item-label .item-meta .item-meta-date { font-size: 12px;  position: relative;float: left;  padding-left: 5px;text-align:left;text-transform: none;  color: #f1f1f1; max-width: 75%; }
.bg-purple { background-color: #bc99c4!important;}
.bg-yellow { background-color: #f9bb3c!important;}
.bg-orange { background-color: #f68e5f!important;}
.bg-red { background-color: #e8583d!important;}
.bg-green { background-color: #46c47c!important;}
.bg-blue { background-color: #6fa3ef!important;}
.bg-grey { background-color: #f7f7f7!important;}
.bg-deepgrey { background-color: rgba(0,0,0,.5)!important;}
.bg-white { background-color: #fff!important;} 

具体来说也很简单,可能会有人认为,这样页面就相当于有了2个重复的外链链接,比如14个友情链接,就相当于28个导出链接了(14个是隐藏着),其实js生成的外链对百度来说是无效的,真正意义上页面还是只存在14个友情导出链接,所以就不用担心了

TAGS:typecho 友情链接
!如链接失效请在下方留言。本站所有资源均来源于网络,版权属于原作者!仅供学习参考,本站不对您的使用负任何责任。如果有侵权之处请第一时间联系我们删除,敬请谅解!