美容・健康・ファッション・インテリア・DVD・お花・ギフト 安全安心のお買い物

町工場ネット トップ  ◇サイトマップ ◇新規登録 ◇プライバシーポリシー ◇相互リンクの方法 ◇問い合わせ

町工場 | 総合 | 美容 | ファッション | インテリア | 家電 | 資格| 食料 | 個人開業 | 書籍 | ギフト | ホビー | CD・DVD

←前ページ トップページ 内容一覧 次ページ→
■いろいろな入力フォーム

文字ごとに色を変えています。



各行に色をつけたものです。


トップページに更新情報なんかをよく見かけますが、



ありきたりのものはよくないと思います。少し手を加えればずいぶんよくなるものです。




テキストエリアなら背景に画像を指定することも出来ます。 背景もスクロールします。画像の大きさに合わせてテキストエリアを調節しましょう。




テキストエリアなら背景に画像を指定することも出来ます。 背景を固定したものです。。画像の大きさに合わせてテキストエリアを調節しましょう。



さらに、テキストエリアの枠の色を変えたものです。





さらにさらに、スクロールバーの色を変えたものです。




背景を左側たてにだけ、表示したものです。背景固定。




背景を右側たてにだけ、表示したものです。背景固定。

どうです。ずいぶん印象が違うものです。これならトップページにおいても違和感なくなるでしょう。あとは、いろいろ組み合わせたり、色を変えたりして楽しんでください。

指定には、スタイルシートを使用しています。最終の形のものをみましょう。ここから余計なものを削除すれば、思いのものができます。


.image6{
SCROLLBAR-FACE-COLOR: #ff99ff;
SCROLLBAR-HIGHLIGHT-COLOR: white;
SCROLLBAR-SHADOW-COLOR: white;
SCROLLBAR-ARROW-COLOR: white;
SCROLLBAR-BASE-COLOR: #ff99ff ・・スクロールバーの色指定
border-width:1px; ・・・・・・・・・枠の太さ           
border-color:#ff0080;・・・・・・・枠の色
border-style:solid;・・・・・・・枠の形
background-image : url(apple4.gif);・・・・背景画像の指定
background-position:right;・・・・・背景画像の位置。
background-repeat:repeat-y;・・・縦一列の指定。
background-attachment:fixed;・・・背景の固定。固定しないときは削除
color:#000000;・・・・・・・・・・・文字の色
}

上の指定を<STYLE></STYLE>で囲んで、下のように呼び出します。

<TEXTAREA rows="5" cols="25" class="image6">〜〜〜〜</TEXTAREA>

赤字のところは、必ず、両方とも同じ名前を付けるようにしましょう。

←前ページ トップページ 内容一覧 次ページ→