きなこの　愉快な　楽天日記枠＆miniﾀｸﾞ講座

■テーブル５

☆テーブルを作ろう　NO５☆　　

このまま、コピーして使えます。

★　フィルター効果を使ったテーブル　１　★

見本　１

何も加工していない画像です。

<table BORDER="3"><tr><td> <IMG SRC="http://画像ＵＲＬ" width="191px" height="213px"> </td></tr></table><BR><BR>

見本　2

右の方にぼかしが入ります。

<table BORDER="1"><tr><td> <IMG SRC="http://画像ＵＲＬ" style="positiom:absolute;filter:alpha (style=1) " width="191px" height="213px"> </td></tr></table>

見本　3

丸い感じのぼかしです。

背景色つきです

背景色なしです

<table BORDER="1" STYLE=background-color:pink> <tr><td> <IMG SRC="http://画像ＵＲＬ" style="positiom:absolute;filter:alpha (style=2) " width="191px" height="213px"> </td></tr></table>

見本　4

放射線状に陰が入ります。

背景色つきです

背景色なしです

<table BORDER="1" STYLE=background-color:#D8BFD8> <tr> <td> <IMG SRC="http://画像ＵＲＬ" style="positiom:absolute;filter:alpha (style=3) " width="191px" height="213px"> </td></tr></table>

見本３・４・ で、背景無しにする時は
<table BORDER="1" STYLE=background-color:#D8BFD8>
を <table BORDER="1" > にして下さい。

見本１ には、背景色の指定が無いだけで
見本２・３ 　と同じタグです。

違うのは、青字で書かれている箇所です。

(Style=1)　(Style=2)　(Style=3)

単純なタグですが、これがフィルターの種類を決めます。

背景色は好きな色を入れて下さいね

・:--☆--:・:--☆--:・:--☆--:・:--☆--:・:--☆--:・:--☆--:・:

★　おまけ　★

見本３・４　の表示は、テーブルＩＮテーブルのタグと
タイトルのタグを使っています。

説明は書きませんが、良かったら、研究してください。

ここでは、見本３を載せています。

<TABLE BORDER> <TR> <TD><table BORDER="1" STYLE=background-color:#FFECEC> <CAPTION ALIGN=bottom><font size="2">背景色つきです</font></CAPTION> <tr><td> <IMG SRC="http://moto05yuki24dai11.hp.infoseek.co.jp/neko/2004-07-16%20076.JPG" style="positiom:absolute;filter:alpha(style=2)" width="191px" height="213px"></TD></TR></table><TD><table BORDER="1"> <CAPTION ALIGN=bottom><font size="2">背景色なしです</font></CAPTION> <tr><td> <IMG SRC="http://moto05yuki24dai11.hp.infoseek.co.jp/neko/2004-07-16%20076.JPG" style="positiom:absolute;filter:alpha(style=2)" width="191" height="213"></TD></TR></TABLE></TD></TR></table>

★　フィルター効果を使ったテーブル　２　★

見本　１

何も加工していない画像です。

★ここに文字★

<table border="1" bordercolor="#000000" width="230px" height="207px"> <tr> <td background="http://画像ＵＲＬ" align="center" > ★ここに文字★ </td> </tr> </table>

見本　２

★ここに文字★

<table border="1" bordercolor="#000000" width="230px" height="207px"> <tr> <td background="http://画像ＵＲＬ" style="filter:Alpha (Style=1) " align="center"> ★ここに文字★ </td> </tr> </table>

見本　３

★ここに文字★

<table border="1" bordercolor="#000000" width="230px" height="207px"> <tr> <td background="http://画像ＵＲＬ" style="filter:Alpha (Style=2) " align="center"> ★ここに文字★ </td> </tr> </table>

見本　４

★ここに文字★

<table border="1" bordercolor="#000000" width="230px" height="207px"> <tr> <td background="http://moto05yuki24dai11画像ＵＲＬ" style="filter:Alpha (Style=3) " align="center"> <B>★ここに文字★</B> </td> </tr> </table>

画像フィルター

でもう少し詳しく説明しています。

テーブル　１・２・３・４・６・７