淘先锋技术网

首页 1 2 3 4 5 6 7

带日历的html时间代码可以展示一个完整的日历,并标明当前日期。下面是一段示例代码:


<!DOCTYPE html>
<html>
<head>
    <title>带日历的时间代码</title>
    <style>
        table {
            border-collapse: collapse;
        }
        
        td {
            width: 50px;
            height: 50px;
            text-align: center;
            vertical-align: middle;
            border: 1px solid gray;
        }
        
        th {
            height: 50px;
            text-align: center;
            background-color: gray;
            color: white;
        }
        
        .today {
            background-color: yellow;
        }
    </style>
</head>
<body>
    <table>
        <tr>
            <th>日</th>
            <th>一</th>
            <th>二</th>
            <th>三</th>
            <th>四</th>
            <th>五</th>
            <th>六</th>
        </tr>
        <?php
            date_default_timezone_set('Asia/Shanghai');
            $today = date('Y-m-d');
            $timestamp = strtotime($today);
            $monthStartDay = date('Y-m-01', $timestamp);
            $monthStartWeekDay = date('w', strtotime($monthStartDay));
            $monthEndDay = date('Y-m-t', $timestamp);
            $monthEndWeekDay = date('w', strtotime($monthEndDay));
            $calendar = array();
            for ($i = 0; $i < $monthStartWeekDay; $i++) {
                array_push($calendar, '<td></td>');
            }
            for ($i = 1; $i <= date('t', $timestamp); $i++) {
                $day = date('Y-m-', $timestamp) . str_pad($i, 2, '0', STR_PAD_LEFT);
                if ($day == $today) {
                    array_push($calendar, '<td class="today">' . $i . '</td>');
                } else {
                    array_push($calendar, '<td>' . $i . '</td>');
                }
                if (($monthStartWeekDay + $i) % 7 == 0) {
                    array_push($calendar, '</tr><tr>');
                }
            }
            for ($i = $monthEndWeekDay + 1; $i <= 6; $i++) {
                array_push($calendar, '<td></td>');
            }
            echo implode('', $calendar);
        ?>
    </table>
</body>
</html>

带日历的html时间代码

代码中使用了PHP语言,通过当前日期计算出当月的起始日期和结束日期,并动态生成日历表格。如果当前日期是当日,则该日期所在单元格标记出来。