我如何在假期列表中使用 css 转换,这样当我将鼠标悬停在图像上时,它需要显示大图像大小,当我将鼠标移出时,它需要返回到正常状态,我知道使用 javascript,但我希望这样做使用 css3 http://jsfiddle.net/TwRTc/
<html>
<head>
<style>
# select
{
transition:width 2s;
-moz-transition:width 2s; /* Firefox 4 */
-webkit-transition:width 2s; /* Safari and Chrome */
-o-transition:width 2s; /* Opera */
}
</style>
</head>
<body>
<table border="0" cellpadding="0" cellspacing="15" style="font-family:Comic Sans MS; color:#0066CC;">
<tr align="left">
<TH></TH>
<th>HOLIDAYS </th>
<th>DAYS OBSERVED</th>
</tr>
<tr>
<td><img class="select" src="C:/Documents and Settings/user/Desktop/new year1.jpg" width="25" height="25" border="1"> </td>
<td> NEW YEARS DAY </td>
<td>JANUARY 01, 2012</td>
</tr>
<tr>
<td><img class="select" src="C:/Documents and Settings/user/Desktop/bhogi.jpg" width="25" height="25" border="1"></td>
<td>BHOGI/MAKAR SANKRANTHI</td>
<td> JANUARY 13, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/republic day.jpg" width="25" height="25" border="1"></td>
<td>REPUBLIC DAY </td>
<td>JANUARY 26, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/ugadhi.jpg" width="25" height="25" border="1" ></td>
<td>UGADI </td>
<td> MARCH 23, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/good friday.jpg" width="25" height="25" border="1" ></td>
<td>GOOD FRIDAY </td>
<td>APRIL 06, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/independence day.jpg" width="25" height="25" border="1"></td>
<td>INDEPENDENCE DAY</td>
<td>AUGUST 15, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/489ramzan.gif" width="25" height="25" border="1"></td>
<td> RAMZAN</td>
<td>AUGUST 20, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/vinaka chowathi.jpg" width="25" height="15" border="1" ></td>
<td>VINAYAKA CHAVITHI</td>
<td> SEPTEMBER 19, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/dasara.jpg" width="25" height="25" border="1"></td>
<td>DASARA</td>
<td>OCTOBER 24, 2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/diwali1.jpg" width="25" height="25" border="1"></td>
<td>DIWALI</td>
<td>NOVEMBER 13,2012</td>
</tr>
<tr>
<td><img src="C:/Documents and Settings/user/Desktop/images.jpg" width="25" height="25" border="1"></td>
<td>CHRISTMAS</td>
<td>DECEMBER 25, 2012</td>
</tr>
</table>
</body>
</html>