自定义友情链接页面

AI摘要：本文介绍了如何自定义友情链接页面。首先，作者展示了友情链接页面的效果，并提供了新建页面添加友情链接的代码示例。链接的格式包括名称、网址、头像和简介。其次，作者展示了另一种友情链接页面的效果，并提供了填写代码的示例。读者可以根据自己的需求进行修改。

先看看效果

https://www.imsun.org/tools

新建页面添加

<ul id="flinks">
<li>资深网民孙先生</li>
<li>https://www.sunpeiwen.com</li>
<li>https://www.sunpeiwen.com/source/img/logo.jpg</li>
<li>另一个我</li>
<li>资深网民孙先生</li>
<li>https://www.sunpeiwen.com</li>
<li>https://www.sunpeiwen.com/source/img/logo.jpg</li>
<li>另一个我</li>

<link rel="stylesheet" href="https://blogcdn.loliko.cn/friendlinks/link.css" />
<script src="https://blogcdn.loliko.cn/friendlinks/link.js?1111"></script>
!!!

链接的格式如下

<li>名称</li>
<li>网址</li>
<li>头像</li>
<li>简介</li>

效果2

https://www.sunpeiwen.com/links.html

新建页面-文本模式下填写

<link rel="stylesheet" href="https://blogcdn.loliko.cn/Home-main/source/css/links.css" />
<h3 style="color:cyan;font-size:25px;"><i class="iconfont iconjinghao"></i> 友情链接</h3>
<div class="notes_card">
                <a target="_blank" href="https://www.imsun.org/">
                <div class="card-img" style="background-image: url(https://image.thum.io/get/width/1024/crop/768/https://www.imsun.org/);"></div>
                <div class="card-u">
                    <div class="card-u-a">
                    <img class="card-u-avatar" src="https://www.imsun.org/favicon.ico" onerror="this.onerror=null; this.src=this.srcset='https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/link/8f277b4ee0ecd.svg'">
                    </div>
                    <div class="card-u-t">
                    <p class="card-u-t-text">
                        <b class="card-u-t-title">老孙博客</b><br>
                        <a class="card-u-t-text">资深网民</a>
                    </p>
                    </div>
                </div>
                </a>
</div>

自行更改其中的https://www.imsun.org/为自己的链接即可

<div class="notes_card"> 
<a target="_blank" href="https://www.imsun.org/">
 <div class="card-img" style="background-image: url(https://image.thum.io/get/width/1024/crop/768/https://www.imsun.org/);">
</div>
<div class="card-u"> <div class="card-u-a"> <img class="card-u-avatar" src="https://www.imsun.org/favicon.ico" onerror="this.onerror=null; this.src=this.srcset='https://cdn.jsdelivr.net/gh/cdn-x/placeholder@1.0.1/link/8f277b4ee0ecd.svg'"> </div> 
<div class="card-u-t"> 
<p class="card-u-t-text"> 
<b class="card-u-t-title">老孙博客</b>
<br> 
<a class="card-u-t-text">资深网民</a> </p> 
</div> </div> </a> </div>

重复