所以我（再次）开始进行网页设计，并决定为我父亲的业务尝试一个非常复杂的网站。他教棒球，所以我试着制作一个日历。我终于看到了我喜欢使用HTML表格的方式，所以现在我想将日期放入日历中但不想删除表格，因为它需要很长时间才能完善。
所以我想这样做的方法是给所有细胞赋予一个价值，第一个星期天被设置为1，依此类推，直到我达到42，但不知道你是否可以给除了表单字段/对象之外的任何值。我尝试使用divs，这让我感到困惑，而且在目前的技术水平上我不可能让divs符合我的要求。我计划根据日历的管理视图来显示日历显示。我只能通过它来理解，所以你们怎么做呢。我希望日值出现在合适的位置，我可以自己做。我只需要初始月份代码，然后我可以从那里开始。
这里是JSFiddle链接： http://jsfiddle.net/rccrf/m9kny41m/
HTML
<!DOCTYPE html>
<body>
<div id="JMBody">
<div id="masterBody">
<div id="fixed">
<!--Heading Table-->
<header id="Title">
<table id="tTable">
<tr id="topRow">
<td id="leftCell"><image id="ball" src="ball.png" /></td>
<td id="JMB" class="middleCell"><span id="JMBaseball">John Martin Baseball</span><br /><span id="home">Schedule</span></td>
<td id="rightCell" rowspan="3"><image id="john" src="John4.png"></td>
</tr>
<tr id="bottomRow">
<td id="bBat" colspan="2"><img id="bat" src="bat2.png" /></td>
</tr>
</table>
</header>
<!--Navigation Bar-->
<nav id="navBar">
<table id="navi">
<tr id="links">
<td id="link3"><a href="JMHome.html">Home</a></td>
<td id="link1"><a href="JMProHis.html">Professional<br />History</a></td>
<td id="link2"><a href="JMPhilosophy.html">Philosophy</a></td>
<td id="link5"><a href="JMLessons.html">Schedule<br />Lessons</a></td>
<td id="link6"><a href="JMDirections.html">Driving<br />Directions</a></td>
<td id="link7"><a href="JMContact.html">Contact Me</a></td>
</tr>
</table>
</nav>
</div>
<!--Main Body of the site-->
<div id="mBody">
<!----------------------------------------------------------------->
<!----------------Month View 1------------------------------------->
<!----------------------------------------------------------------->
<div class="monthBG" id="monthBG1">
<table class="monthViewMain1" id="monthView1">
<tr><!--Month Name Row-->
<td class="monthName" id="monthName1" colspan=7>November</td>
</tr>
<tr><!--Days of the Week Row-->
<td class="dotw1" id="sun"><b>Sunday</b></td>
<td class="dotw1" id="mon"><b>Monday</b></td>
<td class="dotw1" id="tue"><b>Tuesday</b></td>
<td class="dotw1" id="wed"><b>Wednesday</b></td>
<td class="dotw1" id="thu"><b>Thursday</b></td>
<td class="dotw1" id="fri"><b>Friday</b></td>
<td class="dotw1" id="sat"><b>Saturday</b></td>
</tr>
<tr class="weekRow" id="firstWeek1">
<td class="firstWeekDayCellStart" id="sun1-1" placeholder="1"></td>
<td class="firstWeekDayCell" id="mon2-1" placeholder="2"></td>
<td class="firstWeekDayCell" id="tue3-1" placeholder="3"></td>
<td class="firstWeekDayCell" id="wed4-1" placeholder="4"></td>
<td class="firstWeekDayCell" id="thu5-1" placeholder="5"></td>
<td class="firstWeekDayCell" id="fri6-1" placeholder="6"></td>
<td class="firstWeekDayCellEnd" id="sat7-1" placeholder="7"></td>
</tr>
<tr class="weekRow" id="secondWeek1">
<td class="weekDayCellStart" id="sun8-1" placeholder="1"></td>
<td class="weekDayCell" id="mon9-1" placeholder="2"></td>
<td class="weekDayCell" id="tue10-1" placeholder="3"></td>
<td class="weekDayCell" id="wed11-1" placeholder="4"></td>
<td class="weekDayCell" id="thu12-1" placeholder="5"></td>
<td class="weekDayCell" id="fri13-1" placeholder="6"></td>
<td class="weekDayCellEnd" id="sat14-1" placeholder="7"></td>
</tr>
<tr class="weekRow" id="thirdWeek1">
<td class="weekDayCellStart" id="sun15-1" placeholder="1"></td>
<td class="weekDayCell" id="mon16-1" placeholder="2"></td>
<td class="weekDayCell" id="tue17-1" placeholder="3"></td>
<td class="weekDayCell" id="wed18-1" placeholder="4"></td>
<td class="weekDayCell" id="thu19-1" placeholder="5"></td>
<td class="weekDayCell" id="fri20-1" placeholder="6"></td>
<td class="weekDayCellEnd" id="sat21-1" placeholder="7"></td>
</tr>
<tr class="weekRow" id="fourthWeek1">
<td class="weekDayCellStart" id="sun22-1" placeholder="1"></td>
<td class="weekDayCell" id="mon23-1" placeholder="2"></td>
<td class="weekDayCell" id="tue24-1" placeholder="3"></td>
<td class="weekDayCell" id="wed25-1" placeholder="4"></td>
<td class="weekDayCell" id="thu26-1" placeholder="5"></td>
<td class="weekDayCell" id="fri27-1" placeholder="6"></td>
<td class="weekDayCellEnd" id="sat28-1" placeholder="7"></td>
</tr>
<tr class="weekRow" id="fifthWeek1">
<td class="weekDayCellStart" id="sun29-1" placeholder="1"></td>
<td class="weekDayCell" id="mon30-1" placeholder="2"></td>
<td class="weekDayCell" id="tue31-1" placeholder="3"></td>
<td class="weekDayCell" id="wed32-1" placeholder="4"></td>
<td class="weekDayCell" id="thu33-1" placeholder="5"></td>
<td class="weekDayCell" id="fri34-1" placeholder="6"></td>
<td class="weekDayCellEnd" id="sat35-1" placeholder="7"></td>
</tr>
<tr class="weekRow" id="sixthWeek1">
<td class="weekDayCellLastSun" id="sun36-1" placeholder="1"></td>
<td class="lastWeekDayCell" id="mon37-1" placeholder="2"></td>
<td class="lastWeekDayCell" id="tue38-1" placeholder="3"></td>
<td class="lastWeekDayCell" id="wed39-1" placeholder="4"></td>
<td class="lastWeekDayCell" id="thu40-1" placeholder="5"></td>
<td class="lastWeekDayCell" id="fri41-1" placeholder="6"></td>
<td class="weekDayCellLastSat" id="sat42-1" placeholder="7"></td>
</tr>
</table>
</div>
</div>
</div>
<!-- Footer (also universal) -->
<footer id="legal">
<a href="Disclaimer.html" id="aDisclaimer"> <span id="Disclaimer">Disclaimer</a>!!! </span><span> © <b>2014 RCCRF: Function</b> </span>
</footer>
</div>
</body>
</html>
答案 0 :(得分：0)
这也可能有所帮助。它包含一个jQuery插件，有许多选项http://javascript.daypilot.org/
有一个免费的灯光版本可以完成这项工作：http://javascript.daypilot.org/lite/