时间戳

首页 > 解决方案 > 我想使用 PHP 更改卡片 div 的背景

php - 我想使用 PHP 更改卡片 div 的背景

问题描述

我使用 for 循环从数据库中动态获取数据并显示，现在我必须使用 Php 以不同颜色显示这些卡片不需要 javascript

<div class="row gutter-xs">
     <?php
     foreach($dispcnt as $object)
     {
        ?><div  class="col-xs-3 col-md-3">
        <div class="card bg-info"> // card 
            <div class="card-values">
              <div class="p-x">
                <small><?php echo $object->qa;?> </small>
                <h3 class="card-title-l"><?php echo  $object->cnt;?> Counts</h3>
              </div>
            </div>
            </div>
     </div> // code of card ends here
     <?php }?>
     </div>

我想在 PHP 中更改卡片的颜色当前页面

我除了卡片看起来像这样需要的输出

标签： phpcss

解决方案

这是一个仅限 PHP 的解决方案。只需使用所需颜色设置一个数组，然后在遍历卡片时使用模数循环遍历它们。style在卡片上放置一个属性来设置background颜色。

<div class="row gutter-XS">
     <?php
  $colors = [
'#0298cf',
'#9b479f',
'#4e484e',
'#f70d1a',
];
$count = count($colors);
$i = 0; // increment this counter at the end of the foreach loop
  foreach ($dispcnt as $object)
     {
        ?><div  class="col-xs-3 col-md-3">
        <div class="card BG-info" style="background:<?php echo $colors[($i % $count)]; ?>"> <!-- card -->
            <div class="card-values">
              <div class="p-x">
                <small><?php echo $object->QA;?> </small>
                <h3 class="card-title-l"><?php echo  $object->CNT;?> Counts</h3>
              </div>
            </div>
            </div>
     </div> <!-- code of card ends here -->
     <?php $i++;}?>
     </div>

推荐阅读