当前位置:首页 > PHP

php实现日历周末变红

2026-02-14 03:32:04PHP

PHP实现日历周末变红的方法

要实现日历中周末日期显示为红色,可以通过PHP的日期函数判断当前日期是否为周六或周日,并添加相应的CSS样式。

php实现日历周末变红

获取当前月份的天数和星期信息

使用date()cal_days_in_month()函数获取当前月份的信息:

php实现日历周末变红

$year = date('Y');
$month = date('m');
$daysInMonth = cal_days_in_month(CAL_GREGORIAN, $month, $year);
$firstDay = date('N', strtotime("$year-$month-01"));

生成日历表格并标记周末

创建一个HTML表格,遍历每一天,判断是否为周末:

echo '<table border="1">';
echo '<tr><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th style="color:red;">Sat</th><th style="color:red;">Sun</th></tr>';

$dayCount = 1;
echo '<tr>';
for ($i = 1; $i < $firstDay; $i++) {
    echo '<td></td>';
}

for ($day = 1; $day <= $daysInMonth; $day++) {
    $weekDay = date('N', strtotime("$year-$month-$day"));
    $style = ($weekDay >= 6) ? 'style="color:red;"' : '';
    echo "<td $style>$day</td>";

    if ($weekDay == 7 && $day != $daysInMonth) {
        echo '</tr><tr>';
    }
}

echo '</tr>';
echo '</table>';

使用CSS类替代内联样式

更推荐的做法是使用CSS类来控制样式:

<style>
    .weekend {
        color: red;
    }
</style>

<?php
// 在PHP代码中使用
$class = ($weekDay >= 6) ? 'weekend' : '';
echo "<td class='$class'>$day</td>";
?>

完整代码示例

<?php
$year = date('Y');
$month = date('m');
$daysInMonth = cal_days_in_month(CAL_GREGORIAN, $month, $year);
$firstDay = date('N', strtotime("$year-$month-01"));
?>

<style>
    .weekend {
        color: red;
        font-weight: bold;
    }
    table {
        border-collapse: collapse;
    }
    th, td {
        padding: 8px;
        text-align: center;
        border: 1px solid #ddd;
    }
</style>

<table>
    <tr>
        <th>Mon</th>
        <th>Tue</th>
        <th>Wed</th>
        <th>Thu</th>
        <th>Fri</th>
        <th class="weekend">Sat</th>
        <th class="weekend">Sun</th>
    </tr>
    <tr>
        <?php
        for ($i = 1; $i < $firstDay; $i++) {
            echo '<td></td>';
        }

        for ($day = 1; $day <= $daysInMonth; $day++) {
            $weekDay = date('N', strtotime("$year-$month-$day"));
            $class = ($weekDay >= 6) ? 'weekend' : '';
            echo "<td class='$class'>$day</td>";

            if ($weekDay == 7 && $day != $daysInMonth) {
                echo '</tr><tr>';
            }
        }
        ?>
    </tr>
</table>

这种方法会生成一个完整的月份日历,所有周六和周日的日期都会显示为红色。可以根据需要调整CSS样式来改变颜色的深浅或其他视觉效果。

标签: 变红日历
分享给朋友:

相关文章

vue 实现日历

vue 实现日历

实现基础日历结构 使用 Vue 的模板语法构建日历的网格布局,通常以 7 列(一周)和 5-6 行(月份天数)的表格形式展示。通过 v-for 循环渲染日期单元格,动态绑定样式和事件。 <…

vue实现日历效果

vue实现日历效果

Vue实现日历效果的方法 使用第三方库 Vue生态中有多个成熟的日历组件库,如v-calendar或vue2-calendar,可以快速实现日历功能。安装后直接引入组件即可使用。 npm inst…

vue实现日历方案

vue实现日历方案

vue实现日历方案 使用第三方库(推荐方案) 推荐使用成熟的日历组件库,如v-calendar或fullcalendar-vue,它们提供丰富的功能和定制选项。 安装v-calendar: n…

vue日历实现方案

vue日历实现方案

vue日历实现方案 基于第三方库(如FullCalendar) 安装FullCalendar及其Vue适配器: npm install @fullcalendar/vue @fullcalend…

vue日历拖拽实现

vue日历拖拽实现

Vue 日历拖拽实现方案 使用 vue-draggable 库 安装依赖库: npm install vuedraggable 基础拖拽日历实现代码: <template> <…

vue实现滑动日历

vue实现滑动日历

实现滑动日历的基本思路 使用Vue实现滑动日历需要结合触摸事件(touchstart、touchmove、touchend)或第三方库(如hammer.js)处理滑动逻辑,动态计算日期数据并渲染视图。…