テーブルに影をつけたい

質問

テーブルを作って、そのテーブルにドロップシャドウみたいな影をつけたいのですが可能ですか？
おわかりの方ぜひ宜しくお願いします。

回答No.2

anemone_shrimp · ベストアンサー

IE限定ですが…
filterを使うという手もあります。
http://www.tagindex.com/stylesheet/filter/dropshadow.html

回答No.3

cyokokichi

<div style="background-color:#efefef;">
<table style="position:relative;top:10px;left:10px;background-color:ffffff;">
<tr><td>aaa</td></tr>
</table>
</div>

回答No.1

chie65536

<table border=0 cellspacing=0 cellpadding=0>
<tr>
<td colspan=2 rowspan=2>
<TABLE BORDER=1><TR><!--←オリジナルのテーブル、ここから-->
<TD>～～～</TD><!--←セルの中身-->
<TD>～～～</TD>
</TR>
<TR>
<TD>～～～</TD>
<TD>～～～</TD>
</TR>
</TABLE><!--←オリジナルのテーブル、ここまで-->
</td>
<td><img border=0 src="./n.gif" width=5 height=5></td><!--←ここ以降の「5」はすべて影の太さ-->
</tr>
<tr>
<td bgcolor=#808080><img border=0 src="./n.gif" width=5 height=47></td><!--←「47」はオリジナルのテーブルの大きさに合わせて微調整する。808080は影の色-->
</tr>
<tr>
<td><img border=0 src="./n.gif" width=5 height=5></td>
<td bgcolor=#808080><img border=0 src="./n.gif" width=107 height=5></td><!--←「107」はオリジナルのテーブルの大きさに合わせて微調整する-->
<td bgcolor=#808080><img border=0 src="./n.gif" width=5 height=5></td>
</tr>
</table>

元のオリジナルのテーブルは「大文字」の部分です。そのオリジナルのテーブルの前後に「小文字」の部分を書き加えて下さい。

この例では「n.gif」の画像を表示する事により影の太さを調整しているので「１×１ピクセルの大きさの、透明なGIF画像」を用意する必要があります。但し、影の太さがある程度以下の太さなら、画像は無くても構いません。

やってる事は単純で、以下のような３×３のテーブルを作って
●●□
●●■
□■■

各セルを以下のように指定しているだけです。
●の部分に本来のテーブルを埋め込む
□の部分を空白(透明)に指定
■の部分を影(背景色指定)に指定