在HTML5中，我們可以使用一些簡單的代碼編寫出自己的日歷，其中包括了表格、文本輸入框、以及一些簡單的JavaScript腳本。在本文中，我們將詳細介紹如何使用HTML5來編寫一個簡單的日歷。 首先，在HTML文檔中定義一個表格，用于展現我們的日歷：

<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>
</tbody>
</table>

在表格中，我們定義了一個表頭和一個表身。表頭中的行用于展現星期幾的名稱，而表身則用于展現具體的日期信息。 接下來，我們使用一些JavaScript腳本來生成日期：

var date = new Date();  //獲取當前日期
var year = date.getFullYear();  //獲取年份
var month = date.getMonth()+1;  //獲取月份，需要加1才能得到正確結果
var day = date.getDate();  //獲取當前月份的日期
function getLastDay(y,m){
return new Date(y,m,0).getDate();  //獲取某個月份的最后一天
}
var lastMonthDay = getLastDay(year,month-1);  //獲取上個月最后一天的日期
var currentMonthDay = getLastDay(year,month);  //獲取當前月份最后一天的日期
var html = '';  //定義用于存放HTML代碼的變量
for(var i=1;i<=lastMonthDay;i++){  
html += ''+(lastMonthDay-i+1)+'';  //生成上個月的日期
}
for(var i=1;i<=currentMonthDay;i++){
var className = day==i?'today':'';
html += ''+i+'';  //生成當前月份的日期
}
var tbody = document.querySelector('table tbody');  
var trs = tbody.querySelectorAll('tr');
var tr = trs[0];
tr.innerHTML = html;  //將HTML代碼寫入表格中

在這段JavaScript代碼中，我們定義了一個getLastDay函數，用于獲取指定月份的最后一天。然后，在一個for循環中，我們根據上個月和當前月份的最后一天來生成日期，并使用一個className變量來標注當天是否是當前日期。最后，我們將生成的HTML代碼寫入到表格中。 最后，我們需要添加一些CSS樣式，用于美化我們的日歷：

table{
border-collapse: collapse;
}
td{
text-align: center;
width: 30px;
height: 30px;
line-height: 30px;
border: 1px solid #ccc;
}
.gray{
color: #aaa;
}
.today{
background: #66ccff;
}

在這段CSS代碼中，我們為表格中的單元格定義了一些基本的樣式，包括文本居中、寬度、高度和邊框。同時，我們還為灰色單元格和當天單元格分別添加了不同的樣式。 通過以上操作，我們就可以成功地使用HTML5來編寫出一個簡單的日歷了。