丝袜av在线观看|日本美女三级片在线播放|性欧美一区二区三区|小骚热免费国产视频|黑人va在线观看|女同国产91视频|五月丁香色播Av|国产凸凹视频一区二区|伊人电影久久99|国产成人无码一区二区观看

html5 日歷網(wǎng)頁代碼

這段代碼創(chuàng)建了一個基本的HTML5日歷，以表格形式呈現(xiàn)。你可以將其復(fù)制粘貼到一個HTML文件中并在瀏覽器中打開以查看效果。以下是一個簡單的HTML5日歷網(wǎng)頁代碼示例，它展示了一個基本的月份視圖：

代碼

<!DOCTYPE html>
<html lang=“en”>
<head>



<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Calendar</title>
<style>
    table {
        width: 100%;
        border-collapse: collapse;
    }
    th, td {
        padding: 10px;
        text-align: center;
        border: 1px solid #ccc;
    }
    th {
        background-color: #f2f2f2;
    }
</style>




</head>
<body>



<h2>Calendar</h2>



<table>



<thead>
    <tr>
        <th>Sun</th>
        <th>Mon</th>
        <th>Tue</th>
        <th>Wed</th>
        <th>Thu</th>
        <th>Fri</th>
        <th>Sat</th>
    </tr>
</thead>
<tbody id="calendar-body">
</tbody>




</table>



<script>



function generateCalendar(year, month) {
    const calendarBody = document.getElementById("calendar-body");
    calendarBody.innerHTML = "";

    const firstDay = new Date(year, month, 1);
    const lastDay = new Date(year, month + 1, 0);
    const daysInMonth = lastDay.getDate();
    const startingDay = firstDay.getDay();

    let date = 1;
    for (let i = 0; i < 6; i++) {
        const row = document.createElement("tr");

        for (let j = 0; j < 7; j++) {
            if (i === 0 && j < startingDay) {
                const cell = document.createElement("td");
                row.appendChild(cell);
            } else if (date > daysInMonth) {
                break;
            } else {
                const cell = document.createElement("td");
                cell.textContent = date;
                row.appendChild(cell);
                date++;
            }
        }

        calendarBody.appendChild(row);
        if (date > daysInMonth) break;
    }
}

// Usage
const today = new Date();
const currentYear = today.getFullYear();
const currentMonth = today.getMonth();
generateCalendar(currentYear, currentMonth);




</script>



</body>
</html>

過期時間：永久公開
創(chuàng)建于：2024-03-21 17:50
412