img
白 クリーム 黄色 淡い緑 水色 淡い青紫 淡いグレー グレー 黒 茶 赤 濃いピンク ピンク

透過部品


ボタンを透過する

  ie6 nn7 op8

スタイルを指定すると、ボタンを透過することができます。

■ ボタンの透過

 ←通常のボタン
<input type="button" value="通常のボタン">

<input type="button" value="背景透過ボタン" style="background-color:transparent;">

 ←背景を透過したボタン(背景は画像)
例: <input type="button" value="背景透過ボタン" style="background-color:transparent;">
 ←背景を透過したボタン(背景色有り)
例: <input type="button" value="背景透過ボタン" style="background-color:transparent;">

font-size:数値pt; を追加すると文字サイズを、color:色名; を追加すると文字色を変更できます。

<input type="button" value="背景透過ボタン" style="background-color:transparent;font-size:数値pt;">
<input type="button" value="背景透過ボタン" style="background-color:transparent;color:色名;">



例: <input type="button" value="背景透過ボタン" style="background-color:transparent;font-size:12pt;">

例: <input type="button" value="背景透過ボタン" style="background-color:transparent;color:#0033ff;">

ボタンの装飾方法は その他の小技→プッシュボタン を参照して下さい。




テキストボックスを透過

  ie6 nn7 op8

スタイルを指定すると、テキストボックスを透過することができます。

■ テキストボックスの透過

 ←通常のテキストボックス
<input type="text" size="数値" value="通常テキストボックス">

<input type="text" size="数値" value="透過テキストボックス"style="background-color:transparent;">

 ←背景を透過したテキストボックス(背景は画像)
例: <iinput type="text" size="30" value="透過テキストボックス"style="background-color:transparent;">
 ←背景を透過したテキストボックス(背景色有り)
例: <input type="text" size="30" value="透過テキストボックス"style="background-color:transparent;">

font-size:数値pt; を追加すると文字サイズを、color:色名; を追加すると文字色を変更できます。

<input type="text" size="数値" value="透過テキストボックス" style="background-color:transparent;font-size:数値pt;">
<input type="text" size="数値" value="透過テキストボックス" style="background-color:transparent;color:色名;">


例: <input type="text" size="30" value="背景透過ボタン" style="background-color:transparent;font-size:12pt;">

例: <input type="text" size="30" value="背景透過ボタン" style="background-color:transparent;color:#0033ff;">

テキストボックスを装飾する方法は テキストエリア→テキストボックス を参照して下さい。




テキストエリアを透過

  ie6 nn7 op8

スタイルを指定すると、テキストエリアを透過することができます。

■ テキストエリアの透過

 ←通常のテキストエリア
<textarea cols="横幅"rows="縦幅">通常のテキストエリア</textarea>

<textarea cols="横幅"rows="縦幅" style="background-color:transparent;">透過テキストボックス</textarea>

例: <textarea cols="40"rows="3" style="background-color:transparent;">透過テキストエリア</textarea>

font-size:数値pt; を追加すると文字サイズを、color:色名; を追加すると文字色を変更できます。

<textarea cols="横幅" rows="縦幅" style="background-color:transparent;font-size:数値pt;">透過テキストエリア</textarea>
<textarea cols="横幅" rows="縦幅" style="background-color:transparent;color:色名;">透過テキストエリア</textarea>


例: <textarea cols="40" rows="3" font-size:12pt; style="background-color:transparent;font-size:12pt;">透過テキストエリア</textarea>
例: <textarea cols="40"rows="3" style="background-color:transparent;color:#0033ff;">透過テキストエリア</textarea>

テキストエリアを装飾する方法は テキストエリア→テキストエリア を参照して下さい。