如何給每個人提供不同的bg顏色 <td> 使用php函數創建？

Question

我有一張表顯示使用php函數創建的7周一周。 如何在表格中為每一天提供不同的背景顏色。 我是新手，任何和所有的幫助都會很棒。

<?php 
for($prev_days = 0 ; $prev_days<7;$prev_days++) {
    $curr_date = date('Y-m-d', strtotime(-$prev_days.' days'));
    $dayOfWeek = date("l",strtotime(strval($curr_date)));
    /*echo $dayOfWeek;*/
?>
    <td title="click here to see the files">
        <label>
            <a onclick="document.getElementById('id01').style.display='block'" class="clr">
                <?php echo substr(strval($dayOfWeek),0,3); ?>
            </a>
        </label>
    </td>
<?php
    }
?>

.CSSTableGenerator tr:first-child td{
background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);    
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );
background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");  background: -o-linear-gradient(top,#005fbf,003f7f);
background-color:#005fbf;
}

這是創建的表： https ： //i.stack.imgur.com/nLnxP.png

Answer 1

CSS唯一解決方案。 將一個類放在td的tr父級上，然后使用1到7之間的數字在每個上添加bg顏色。

.someclass td:nth-child(1) {
  background:blue
}
.someclass td:nth-child(2) {
  background:red
}
....
.someclass td:nth-child(7) {
  background:green
}



<tr class="someclass">
<?php for($prev_days = 0 ; $prev_days<7;$prev_days++) {$curr_date = date('Y-m-d', strtotime(-$prev_days.' days'));$dayOfWeek = date("l",strtotime(strval($curr_date)));
/*echo $dayOfWeek;*/?>
<td title="click here to see the files"><label><a onclick="document.getElementById('id01').style.display='block'" class="clr"><?php echo substr(strval($dayOfWeek),0,3); ?></a></label></td>
<?php}?>
</tr>

編輯：再次看你的圖像第二個解決方案，我有不好。

Answer 2

CSS解決方案

使用第n個術語：

td:nth-of-type(1) {
  background: red;
}
td:nth-of-type(2) {
  background: blue;
}
td:nth-of-type(3) {
  background: green;
}
td:nth-of-type(4) {
  background: yellow;
}
td:nth-of-type(5) {
  background: orange;
}
td:nth-of-type(6) {
  background: gray;
}

... 等等

PHP解決方案

首先，您需要創建一個返回隨機HEX或其他內容的方法

像這樣：

<?php
function random_color_part() {
    return str_pad( dechex( mt_rand( 0, 255 ) ), 2, '0', STR_PAD_LEFT);
}

function random_color() {
    return random_color_part() . random_color_part() . random_color_part();
}
?>

• 使用PHP生成隨機十六進制顏色代碼

接下來，我們需要像這樣使用它：

<?php for($prev_days = 0 ; $prev_days<7;$prev_days++) {$curr_date = date('Y-m-d', strtotime(-$prev_days.' days'));$dayOfWeek = date("l",strtotime(strval($curr_date)));
/*echo $dayOfWeek;*/?>
<td title="click here to see the files"><label><a onclick="document.getElementById('id01').style.display='block'" style=<?php echo "'" . random_color() . "'" ?> class="clr"><?php echo substr(strval($dayOfWeek),0,3); ?></a></label></td>
<?php}?>

所以基本上我們使用PHP為每個TD輸出動態樣式屬性。

希望，這有助於你，伙計！

Answer 3

有很多方法可以做到這一點。 我可以在這看到一些好的解決方案。 但這里只是一個PHP解決方案，代碼中只有很少的更改。

<?php 
$day_color = ["#ffccee","#ccccee","#f1dcee","#a2ccf3","#d7c3e3","#f3cc3e","#6fc63e"];
for($prev_days = 0 ; $prev_days<7;$prev_days++) {
    $curr_date = date('Y-m-d', strtotime(-$prev_days.' days'));
    $dayOfWeek = date("l",strtotime(strval($curr_date)));
    /*echo $dayOfWeek;*/
?>
    <td title="click here to see the files">
        <label style="background-color:<?php echo $day_color[$prev_days]?>">
            <a onclick="document.getElementById('id01').style.display='block'" class="clr">
                <?php echo substr(strval($dayOfWeek),0,3); ?>
            </a>
        </label>
    </td>
<?php
    }
?>

您可以根據需要在$day_color數組中選擇所需的顏色。