<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>制作年历</title>
<style>
body{text-align: center;}
.box{margin: 0 auto;width: 880px;}
.title{background: #ccc;}
table{height:200px;width: 200px;font-size: 12px;text-align: center;float: left;margin: 10px;font-family:arial; }
</style>
</head>
<body>
<script>
var year = parseInt(prompt('输入年份:','2018'));
document.write(calendar(year));
function calendar(y){
var w = new Date(y, 0).getDay();
var html = '';
for(var m = 1;m <=12;++m){
html += '<table>';
html += '<tr><th colspan="7">' +y +'年' + m +' 月</th></tr>';
html += '<tr><td>日</td><td>一</td><td>二</td><td>三</td><td>四</td>';
html += '<td>五</td><td>六</td></tr>';
var max = new Date(y,m,0).getDate();
html += '<tr>';
for(var d = 1;d <= max;++d){
if(w && d ==1){
html +='<td colspan="'+ w +'"></td>';
}
html += '<td>'+ d +'</td>';
if(w == 6 && d !=max){
html +='</tr><tr>';
}else if(d == max){
html += '</tr>';
}
w = (w+1 > 6)?0:w+1;
}
html += '</table>';
}
return html;
}
</script>
</body>
</html>