CSS 制作有弹性的日历表

<ol class="calendar" start="6">
<li id="lastmonth">
<ol start="29">
<li>29</li>
<li>30</li>
</ol>
</li>
<li id="thismonth">
<ol>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>11</li>
<li>12</li>
<li>13</li>
<li>14</li>
<li>15</li>
<li>16</li>
<li>17</li>
<li>18</li>
<li>19</li>
<li>20</li>
<li>21</li>
<li>22</li>
<li>23</li>
<li>24</li>
<li>25</li>
<li>26</li>
<li>27</li>
<li>28</li>
<li>29</li>
<li>30</li>
<li>31</li>
</ol>
</li>
<li id="nextmonth">
<ol>
<li>1</li>
<li>2</li>
</ol>
</li>
</ol>

/
CSS Calendar
Tim Wright
Chris Coyier
-----------------------------/
{marg:0;paddg:0;}
body {font:1em/1.4 Verdana, Arial, Helvetica, sans-serif;
background: url(images/bg.jpg) center no-repeat #545454;}
body {display:le;}
ol.calendar {width:52em;marg:0 auto;display:block; m-height: 200px;
background: url(images/tl.png) left no-repeat; paddg: 12px 0 0 20px;}
li {list-style:none;}
p.lk {text-align:center;display: block;}
h1 {display: block; width: 200px;height:76px;
background:url(images/july.png);text-dent:-9999px; marg: 15px auto; }
/
Day styles
-------------------------/
li li {width:6em;height:6em;float:left;marg:.2em; paddg:.2em;overflow:auto;
background: url(images/day-bg.png) bottom right no-repeat; }
/
Day content (UL/OL & P)
-------------------------/
li li p {font-size:.7em;display:block;}
li li ol {width:auto;}
li li ul li,
li li ol li {font-size:.7em;display:block;height:auto;width:auto; background: none;
marg:0;paddg:.2em 0;float:none;}
/
Holiday class
-------------------------/
li li.holiday { }
/
Inactive months
-------------------------/
li#lastmonth li,
li#nextmonth li { background: url(images/day-bg-active.png);}