许多人来问我网站的边栏作者怎么搞的那么，我就出一个教程来让大家看一下。效果图：html代码展示：<div class=”comment-info” style=”bode: 1px solid #efefef;border-bottom: 1px solid #efefef;padding: 5px 0px 5px 0px;“><a href=”https://www.yaoruanwen.com/user/27″ target=”_blank” rel=”noopener noreferrer”><img alt=”卢松松 ” src=”https://images.yaoruanwen.com/member/avatars/f10e0327ad868d13.1587109956.jpg” class=”avatar avatar-60 photo” height=”40″ width=”40″ style=” border-radius: 18px 18px 18px 18px;”></a><a href=”https://www.yaoruanwen.com/user/27″> <span>卢松松</span></a><a href=”https://www.yaoruanwen.com/asks”><span class=”TW_6″>向他提问</span></a><span>知名站长，自媒体人</span></div><div class=”comment-info” style=”bode: 1px solid #efefef;border-bottom: 1px solid #efefef;padding: 5px 0px 5px 0px;“><a href=”https://www.yaoruanwen.com/user/21″ target=”_blank” rel=”noopener noreferrer”><img alt=”牛鞭士” src=”https://images.yaoruanwen.com/member/avatars/c048e8850243be80.1585730776.jpg” class=”avatar avatar-60 photo” height=”40″ width=”40″ style=” border-radius: 18px 18px 18px 18px;”> </a><a href=”https://www.yaoruanwen.com/user/21″> <span>牛鞭士</span></a><a href=”https://www.yaoruanwen.com/asks”><span class=”TW_5″>向他提问</span></a><span>牛鞭士科技自媒体平台</span></div><div class=”comment-info” style=”bode: 1px solid #efefef;border-bottom: 1px solid #efefef;padding: 5px 0px 5px 0px;“><a href=”https://www.yaoruanwen.com/user/3″ target=”_blank” rel=”noopener noreferrer”><img alt=”王一半” src=”https://images.yaoruanwen.com/member/avatars/87e4b5ce2fe28308.1583479793.jpg” class=”avatar avatar-60 photo” height=”40″ width=”40″ style=” border-radius: 18px 18px 18px 18px;”> </a><a href=”https://www.yaoruanwen.com/user/3″> <span>王一半</span></a><a href=”https://www.yaoruanwen.com/asks”><span class=”TW_4″>向他提问</span></a><span>一名站长，自媒体及法式员</span></div><div class=”comment-info” style=”bode: 1px solid #efefef;border-bottom: 1px solid #efefef;padding: 5px 0px 5px 0px;“><a href=”https://www.yaoruanwen.com/user/5″ target=”_blank” rel=”noopener noreferrer”><img alt=”王听风” src=”https://images.yaoruanwen.com/member/avatars/b7fbbce2345d7772.1583480089.jpg” class=”avatar avatar-60 photo” height=”40″ width=”40″ style=” border-radius: 18px 18px 18px 18px;”> </a><a href=”https://www.yaoruanwen.com/user/5″> <span>王听风</span></a><a href=”https://www.yaoruanwen.com/asks”><span class=”TW_3″>向他提问</span></a><span>知名站长,我要推广网,我要软文网首创人</span></div><div class=”comment-info” style=”bode: 1px solid #efefef;border-bottom: 1px solid #efefef;padding: 5px 0px 5px 0px;“><a href=”https://www.yaoruanwen.com/user/23″ target=”_blank” rel=”noopener noreferrer”><img alt=”聚点网络” src=”https://images.yaoruanwen.com/member/avatars/cfc748049e45d87b.1585731220.jpg” class=”avatar avatar-60 photo” height=”40″ width=”40″ style=”border-radius: 18px 18px 18px 18px;”></a><a href=”https://www.yaoruanwen.com/user/23″><span>聚点网络</span></a><a href=”https://www.yaoruanwen.com/asks”> <span class=”TW_2″>向他提问</span></a><span> 分享逐日科技要文</span></div><div class=”comment-info” style=”bode: 1px solid #efefef;border-bottom: 1px solid #efefef;padding: 5px 0px 5px 0px;“><a href=”https://www.yaoruanwen.com/user/2″ target=”_blank” rel=”noopener noreferrer”><img alt=”骑士团队” src=”https://images.yaoruanwen.com/member/avatars/28d9d4c2f636f067.1583479571.jpg” class=”avatar avatar-60 photo” height=”40″ width=”40″ style=” border-radius: 18px 18px 18px 18px;”> </a><a href=”https://www.yaoruanwen.com/user/2″> <span>骑士团队</span></a><a href=”https://www.yaoruanwen.com/asks”> <span class=”TW_u”>向他提问</span> </a><span> 骑士团队，为社群营销服务</span></div>css代码展示.TW_u:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}.TW_u{margin-left: 30%;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_1{margin-left: 0;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_2{margin-left: 30%;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_3{margin-left: 35%;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_4{margin-left: 35%;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_5{margin-left: 35%;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_6{margin-left: 36%;font-size: 10px;padding: 2px 12px;border: 1px solid #999;border-radius: 3px;color: #666;}.TW_1:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}.TW_2:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}.TW_3:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}.TW_4:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}.TW_5:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}.TW_6:hover{background-color:#ed7316;color:white;border: 1px solid #ed7316;}下载地址：https://www.yaoruanwen.com/n/28706.html。

本文来源：米6体育app官网下载安卓-www.sdqbhg.com