メインメニュー


[スポンサードリンク]


画像や文字の中の一色を透過させる
filter:progid:DXImageTransform.Microsoft.Chroma(属性)
属性:
color 透過させる色を指定
(詳細は『色の指定方法』を御覧ください)
enabled フィルタを設定するかどうかを指定
 0,false:フィルタを設定しない
 1,true :フィルタを設定する

filterプロパティのChromaフィルタを使って、画像や文字の中の一色を透過させます。
画像はJPEGでも透過させることができますが、一色しか透過できないので写真画像やぼかしの入っている画像などは綺麗な形に透過できない場合があります。
また、文字に対して透過させる場合は、背景の色を指定しておかないと文字自体が透過されて表示されなくなってしまいます。

必要な属性は、半角のカンマ「,」で区切って指定します。
DIV要素やSPAN要素に適用させる場合は、positionプロパティに「absolute」を指定するか、widthやheightプロパティを使って表示位置を指定する必要があります。
この指定をしなければフィルタの効果は現れません。
また、このフィルタはInternetExplorer5.5以上のブラウザと、DirectXというWindowsの機能で表示できます。



↑元の画像


↑白を透過しています


↑白を透過しています
(写真画像などは綺麗に透過されない場合があります)

素材:(c)MINE CHANNEL! 写真素材:(c)素材散策


<STYLE type="text/css">
<!--
.case2 {
filter:progid:DXImageTransform.Microsoft.Chroma(color=#ffffff);
}
-->
</STYLE>

<TABLE width="100%" cellpadding="0" cellspacing="15" background="img/bg10_03_1.gif">
<TR>
<TD><IMG src="img/plate10_03_2.gif" width="139" height="95" border="0"><BR>
↑元の画像<BR><BR>
<IMG src="img/plate10_03_2.gif" width="139" height="95" border="0" class="case2"><BR>
↑白を透過しています<BR><BR>
<IMG src="img/piflw10_03_3.jpg" width="100" height="100" border="0" class="case2"><BR>
↑白を透過しています<BR>
(写真画像などは綺麗に透過されない場合があります)</TD>
</TR>
</TABLE>