|
{border:太さ 色 種類;}でフォームのボタンや入力欄の枠線の太さ、色、種類を指定する
ことができます。
枠線の細かな指定方法はボックスの
枠線の太さを指定する
枠線の種類を指定する
枠線の色を指定するの項目を参照してください。
枠線の種類
枠線の種類は以下の通りです。
| 線の種類 |
説明 |
| solid |
通常の線 |
| double |
二重線 |
| ridge |
山形の線 |
| groove |
谷型の線 |
| dotted |
点線 |
| dashed |
大きな点線 |
| inset |
内側にくぼんだ線 |
| outset |
外側に突出した線 |
【ブラウザ表示】
ソース
<form method="POST" action="xxx.cgi">
<div>
<input type="text" name="text1" class="sample5" value="テキストフィールド">
</div>
<p>
<textarea name="area1" class="sample6" cols="20" rows="8">テキストエリア</textarea>
</p>
<p>
<input type="submit" value="送信" class="sample7">
</p>
</form>
外部ファイル
input.sample5{border:2px yellow solid;}
textarea.sample6{border:2px green dotted;}
input.sample7{border:4px gray double;}
<body>～</body>に直接記入する場合
<form method="POST" action="xxx.cgi">
<div>
<input type="text" name="text1" style="border:2px yellow solid;" value="テキストフィールド">
</div>
<p>
<textarea name="area1" style="border:2px green dotted;" cols="20" rows="8">テキストエリア</textarea>
</p>
<p>
<input type="submit" value="送信" style="border:4px gray double;">
</p>
</form>
■ その他の項目
・
ボタンや入力欄のサイズを変える
・
文字のサイズや色を変える
・
背景色や画像を指定する
・
外側、部品の余白を指定する
・
フォームを並べる
・
入力欄の入力モードを変更する
・
フォームの部品の色を変える
スタイルシート一覧のページに戻る
|
