西安网站建设公司分享高校博达网站群网站建设制作中首页图片分三列显示代码如下

  1. 首页
  2. 资讯帮助
  3. 西安网站建设公司分享高校博达网站群网站建设制作中首页图片分三列显示代码如下
    2736 次阅读    资讯帮助
<p>高校博达网站群网站建设制作中首页图片分三列显示代码如下</p><p>其中.col-lg-4{flex:0 0 auto;width:33.33333333%}</p><p>&lt;#list list_news as news&gt;<br/>&lt;div class=&quot;col-lg-4 col-md-6&quot;&gt;<br/>&lt;div class=&quot;single-post2 hover-zoomin mb-30 wow fadeInUp animated&quot; data-animation=&quot;fadeInUp&quot; data-delay=&quot;.4s&quot;&gt;<br/>&nbsp;&lt;div class=&quot;blog-thumb2&quot;&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href=&quot;${news.url}&quot; target=_blank title=&quot;${news.tipsTitle}&quot;&gt;&lt;img src=&quot;${news.picUrl}&quot; style=&quot;height:320px;&nbsp; border-top: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc;&quot;&gt;&lt;/a&gt;<br/>&nbsp;&lt;/div&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;<br/>&nbsp;&lt;div class=&quot;blog-content2&quot;&gt;&nbsp;&nbsp; &nbsp;<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=&quot;date-home&quot;&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;i class=&quot;fal fa-calendar-alt&quot; style=&quot;margin-right: 5px;&quot;&gt;&lt;/i&gt; ${v_date(news.date, &quot;MM-dd&quot;)}，${v_date(news.date, &quot;yyyy&quot;)}<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=&quot;b-meta&quot;&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=&quot;row&quot;&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=&quot;col-lg-12 col-md-12&quot;&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=&quot;meta-info&quot;&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;ul&gt;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;i class=&quot;fal fa-user&quot;&gt;&lt;/i&gt; ${news.showAuthor}&lt;/li&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;i class=&quot;fal fa-comment-alt&quot;&gt;&lt;/i&gt; ${news.showClickTimes}&lt;/li&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/ul&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br/><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;h4&gt;&lt;a href=&quot;${news.url}&quot;&gt;${news.showTitle}&lt;/a&gt;&lt;/h4&gt; <br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;p&gt;${news.showAbstract}&lt;/p&gt;<br/>&nbsp;&nbsp;&nbsp;&nbsp; &lt;div class=&quot;blog-btn&quot;&gt;&lt;a href=&quot;${news.url}&quot;&gt;详细内容&lt;/a&gt;&lt;/div&gt;<br/>&nbsp;&lt;/div&gt;<br/>&lt;/div&gt;<br/>&lt;/div&gt;<br/>&lt;/#list&gt;</p><p>样例效果图如下</p><p><img src="/static/upload/image/20230511/1683734898136006.jpg" alt="火狐截图_2023-04-06T12-01-44.jpg"/></p>