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

How to set alternate color for href background

本文关键字：颜色 设置 背景 href      更新时间：2023-09-26

嗨，我想让 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>

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

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

<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;
}

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

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

如果要设置a样式，则需要显示"阻止它"以填充li的空间

相关文章：