直接使用代码

图片素材

无

css代码

 <style>
.index-item{border:1px solid #ccc;border-top:3px solid #00907e;margin:15px 0;min-height: 350px;}
.index-item .news-top{height: 50px; border-bottom: 1px solid #e5ebed;padding-left:15px;}
.index-item .news-top strong.bt1 { font-weight:bold;font-size: 22px; color: #00907e; line-height: 50px; padding-right:10px;  font-weight: 600;float: left;}
.index-item .news-top span.bt2	{font-size: 14px;color: #9a9898;line-height:50px; }
a.gd { float:right; margin-right:10px; color:#333; font-size:14px; line-height:50px; display:block;}

.links .index-item{min-height:200px;}
.links h4{border-left:5px solid #00907e;padding-left:20px; line-height:30px;}
.links .link-list{padding:10px 15px}
.links .link-list a{display:inline-block;padding:10px 15px;margin-right:10px;border:1px solid #00907e;border-radius:6px;margin-top:10px;}
.links .link-list a:hover{background:#00907e;color:#fff}
</style>

HTML+JS代码

 
<div class="container links">
  <div class="index-item">
    <!-- 块头部 -->
    <div class="news-top">
      <a><strong class="bt1">友情链接</strong></a>
      <span class="bt2">Links</span>
      <a class="gd" href="http://www.bootfastui.cn" target="_blank">更多&gt;&gt;</a>
    </div>
    <!-- 块列表 -->
    <div class="news-ul">

      <div class="link-list">
        <a href="http://www.bootfastui.cn" target="_blank">玉门市人民政府</a>
        <a href="http://www.bootfastui.cn" target="_blank">酒泉市卫健委</a>
        <a href="http://www.bootfastui.cn" target="_blank">玉门市卫健委</a>
        <br /><br />
      </div>


    </div>
  </div>
  <div class='clear'> </div>


</div>