memo.xight.org

Home > Changelogメモ > 2004-09 > 2004-09-06 > カーソルを合わせると行の色が変わるテーブル

2008 : 01 02 03 04 05 06 07 08 09 10 11 12
2007 : 01 02 03 04 05 06 07 08 09 10 11 12
2006 : 01 02 03 04 05 06 07 08 09 10 11 12
2005 : 01 02 03 04 05 06 07 08 09 10 11 12
2004 : 01 02 03 04 05 06 07 08 09 10 11 12
2003 : 01 02 03 04 05 06 07 08 09 10 11 12
2002 : 01 02 03 04 05 06 07 08 09 10 11 12

2004-09-06

カーソルを合わせると行の色が変わるテーブル

- pya! の投稿者一覧のようなテーブルが作りたい．
<tr>タグに onmouseover属性と onmouseout 属性を付加する．
横長の表の時に有効．

<table>
	<tr>
		<th>&nbsp;</th><th>1列目</th><th>2列目</th><th>3列目</th><th>4列目</th><th>5列目</th><th>6列目</th>
	</tr>
	<tr onmouseover="this.style.backgroundColor='#cccccc'" onmouseout="this.style.backgroundColor='#ffffff'">
		<th>1行目</th><td>1-1</td><td>1-2</td><td>1-3</td><td>1-4</td><td>1-5</td><td>1-6</td>
	</tr>
	<tr onmouseover="this.style.backgroundColor='#cccccc'" onmouseout="this.style.backgroundColor='#ffffff'">
		<th>2行目</th><td>2-1</td><td>2-2</td><td>2-3</td><td>2-4</td><td>2-5</td><td>2-6</td>
	</tr>
	<tr onmouseover="this.style.backgroundColor='#cccccc'" onmouseout="this.style.backgroundColor='#ffffff'">
		<th>3行目</th><td>3-1</td><td>3-2</td><td>3-3</td><td>3-4</td><td>3-5</td><td>3-6</td>
	</tr>
</table>