美浩工作室是一个以90后团队为主的网站设计,制作,优化,维护为一体的网站建设工作室,为您量身定制适合企业自身的网站,欢迎咨询:15249241469

yxcms调用热点文章判断显示图标问题

yxcms使用技巧 mihoweb 1705℃ 0评论

使用yxcms做热点文章调用的时候,可能大家会想到一个效果,就是前三个是红色的图标,后面的就是灰色的,这个也是很常用的,今天给大家上代码,说说方法,其实yxcms已经有很好的二次开发和实用性。

124938wzkgz5knoccncz95 (1)

这个是效果,代码如下:

  1. <ul class=“m_tjnews”>   
  2.                
  3.             {hot:{table=(news) field=(id,title,color,addtime,method) order=(hits desc,id desc) where=(ispass=’1′) limit=(10)}}   
  4.                     {if $hot_i<=3}   
  5.                      <li class=“tj_n_hong”><span class=“tjnews_num”>[hot:i]</span><a style=“color:[hot:color]“ title=“[hot:title]“ target=“_blank” href=“{url($hot['method'],array(‘id’=>$hot['id']))}”>[hot:title $len=11]</a></li>   
  6.                      {else}   
  7.                      <li><span class=“tjnews_num”>[hot:i]</span><a style=“color:[hot:color]“ title=“[hot:title]“ target=“_blank” href=“{url($hot['method'],array(‘id’=>$hot['id']))}”>[hot:title $len=11]</a></li>   
  8.                      {/if}   
  9.            {/hot}   
  10.                
  11.              
  12.         </ul>  

css代码:

  1. .m_tjnews{border:1px solid #cdcdcdborder-top:nonemargin-bottom:10px; }   
  2. .m_tjnews li{ height:33pxline-height:33pxvertical-align:middleborder-bottom:1px dotted #d6d6d6; *zoom:1;positionrelative;}   
  3. .m_tjnews li a{ margin-left:30pxfont-size:16px;}   
  4. .m_tjnews li a:hover{ color:#ca0e0c;}   
  5. /*xinwen num*/  
  6. .tjnews_num {positionabsolutedisplayinline-block;*displayinline;*zoom:1;width16px;height16px;line-height16px;text-aligncenter;font-size10px;background#ccc;color#fff;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius:5px;margin-right7px;vertical-alignmiddle;top9px;left5px;}   
  7. .tj_n_hong .tjnews_num {background-color#ca1010;}  

这样就可以试试yxcms做出调用热点文章。

如果您喜欢这篇文章,欢迎分享订阅。

转载请注明:美浩工作室官方博客 » yxcms调用热点文章判断显示图标问题

喜欢 (4)