如何为href背景设置替代颜色

时间:2015-01-20 09:08:44

标签: javascript html css

您好我想制作href链接背景替代颜色我怎样才能实现这个

<div class="left_column">
  <div class="category">
    <p>Category</p>
  </div>
  <ul class="side-link">
  <?php 
  $data=mysql_query("select categoryname from category");
  while($row=mysql_fetch_array($data))
  {
    ?>
    <li><a class="linkbutton" href="#" style="text-decoration:none;"><?php echo $row['categoryname']; ?></a></li>
    <?php
  }
  ?>
  </ul>
</div>

3 个答案:

答案 0 :(得分:1)

您无法直接检查链接是偶数还是奇数。但是,您可以检查链接是否嵌套在其父级的偶数或奇数子元素中:

.side-link li:nth-child(odd) .linkbutton {
    background-color: #F00;
}
.side-link li:nth-child(even) .linkbutton {
    background-color: #080;
}

答案 1 :(得分:0)

您可以使用css设置替代li元素的样式

.side-link li{
    background:#ff0000;
}

.side-link li:nth-child(even){
    background:#878787;
}

如果您要为a设置样式,那么您需要显示阻止它以填充li

的空间

答案 2 :(得分:0)

<div class="left_column">
                    <div class="category">
                        <p>Category</p>
                    </div>
                    <ul class="side-link">


        <?php 
        $data=mysql_query("select categoryname from category");
        $t =0;
        while($row=mysql_fetch_array($data))
        {
            if($t==0){
                $t=1;
            ?>
            <li><a  class ="linkbutton odd" href="#" style="text-decoration:none;"><?php echo $row['categoryname']; ?></a></li>
            <?php
            }else{
                     ?>
    <li><a  class ="linkbutton even" href="#" style="text-decoration:none;"><?php echo $row['categoryname']; ?></a></li>
    <?php
             }

        }
        ?>
    </div>
例如

在css中:

enter code here

    .odd{
   background-color: red;
}
.even{
 background:green;
}