巧用 css进行页面逻辑判断 进行不同样式添加

文章标签: css
2014-11-9 18:28:09     21 人阅读    

在html页面中,无法进行有效的if else判断,并且由于某种限制不能使用js来进行判断,在这种条件下如何给不同的条件添加不同的样式?

例如:从通过ajax从后台传递过来一个 time变量,他的值是数字
 当time为0的时候,需要进行加粗展示,为其他数字不需要加粗


正常情况下,会通过jstl标签判断 time值,不同的分支显示不同的样式即可.

无jstl解决方法

设立样式 :
  <style type="text/css">
      .time0 {
        font-weight: bold;
           font-size:18px;
      }
    </style>

 

页面代码配置
<div class="ui-refresh" id="div_table_list">
 <ul class="data-list" id="table_list">
        <li style="display: none;">
            <div style="display: none">{guid}</div><!-- 点击行的参数 --> 
            <div class="div_list_img"  style="float:left;width:15%"><img src="{grtx}" style="width:50px;height:50px;"></div>
            <div class="list_row_con" id="div{guid}"  style="min-height: 60px;" style="float:right;width:80%">   
   <div class="list_row_col2"  >
   <!-- {ydcs} &gt 0 如果阅读次数为0 则.显示加粗细 -->
       <!-- <div class="list_row_col2_2 overflow" style="font-weight: bold;font-size:18px;" onclick="khbf();">{yjzt}</div> -->
    <div class=" time{ydcs} list_row_col2_1 overflow"  onclick="khbf();">{yjzt}</div>
    <div class="list_row_col2_2 overflow" >{yhid}[{cjsj}] time{ydcs}</div>
   </div>   
   <div class="list_row_col3"></div> <!-- 箭头  -->
            </div>
        </li>
    </ul>
    <div class="ui-refresh-down"></div>    
  </div>


看上面的红色 time{ydcs}   只要是ydcs 为0 就会对改行数据进行加粗


原文地址:http://www.itmmd.com/201411/152.html
该文章由 萌萌的IT人 整理发布,转载须标明出处。

java剪切板程序复制,然后获取剪贴板信息还是上次的,不解   上一篇
下一篇  div 内部的div不能撑开父div的解决方法

精彩回复
发表评论
姓名:       

《程序员app》专门为程序员量身定做!