CSS(スタイルシート)のテキストボックス

このページではテキストボックスの装飾スタイルシートをご紹介します。

あいうえお
かきくけこ
さしすせそ
たちつてと
なにぬねの
はひふへほ
まみむめも
や　ゆ　よ
らりるれろ
わ　を　ん

↓<head>～</head>又は外部CSSに↓

.sample5{  
font-size:14px;
color:#0080ff;
background-color:#ffffff;
border:3px solid #0080ff;
text-align:left;
marigin-top:10px;
margin-bottom:10px;
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#ffdfef;
scrollbar-darkshadow-color:#000000;
scrollbar-face-color:#0080ff;
scrollbar-highlight-color:#ffffff;
scrollbar-shadow-color:#80bfff;
scrollbar-track-color:#0080ff;
}

↓<body>～</body>に↓

<TEXTAREA ROWS=3 COLS=30 class="sample5" readonly>
あいうえお
かきくけこ
さしすせそ
たちつてと
なにぬねの
はひふへほ
まみむめも
や　ゆ　よ
らりるれろ
わ　を　ん
</TEXTAREA>

↓HTMLタグに直接付加する場合は(インライン)↓

<TEXTAREA ROWS=3 COLS=30 class="sample5" readonly> style="font-size:14px;color:#0080ff;
background-color:#ffffff;border:3px solid #0080ff;text-align:left;
marigin-top:10px;margin-bottom:10px";
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#ffdfef;
scrollbar-darkshadow-color:#000000;
scrollbar-face-color:#0080ff;
scrollbar-highlight-color:#ffffff;
scrollbar-shadow-color:#80bfff;
scrollbar-track-color:#0080ff;
あいうえお
かきくけこ
さしすせそ
たちつてと
なにぬねの
はひふへほ
まみむめも
や　ゆ　よ
らりるれろ
わ　を　ん
</TEXTAREA>

◎スタイルシートのポイント◎
(サンプルスタイルシートと照らし合わせながら変更して下さい)

sample5[waku1やkakoi1など半角英数字ならＯＫ]
ROWS=数字[テキストボックス縦の行数]
COLS=数字[テキストボックスの横幅]
font-size:数字px;[文字の大きさ(数字の大小)]
color:カラー;[文字の色(カラーコード参照)]
background-color:カラー;[背景の色(カラーコード参照)]
border:数字px 形式カラー;
[数字px(枠の太さ)]
[枠の形式none(枠なし) - solid(実線) - double(二重線) - dotted(点線) - dashed(破線) - groove(へこみ線) - ridge(立体線)]
[枠の色(カラーコード参照)]
marigin-top:数字px;[枠外上側の間隔]
margin-bottom:数字px;[枠外下側の間隔]
スクロールバーのカラー設定については姉妹サイトの説明をご覧下さい
●スクロールバーの各部配色　 ●装飾スクロールバー集

==特選ＰＲ==
☆８５種類もの面白くて可愛いドメインがたくさん！ロリポップサーバー★
☆チカッパ！レンタルサーバー
☆起業家のためのホームページ作成術

CSS(スタイルシート)のテキストボックス

CSS(スタイルシート)のテキストボックス

◎スタイルシートのポイント◎ (サンプルスタイルシートと照らし合わせながら変更して下さい)

◎スタイルシートのポイント◎
(サンプルスタイルシートと照らし合わせながら変更して下さい)