|
トップページ > スタイルシートリファレンス > outline
★スタイルシートリファレンス
|
outline･････アウトラインのスタイル・太さ・色を指定する
  
   
  
     
outlineプロパティは、アウトラインのスタイル・太さ・色をまとめて指定する際に使用します。 スタイル・太さ・色のうち、指定する値を任意の順序でスペースで区切って記述します。 borderプロパティとは異なり、outlineプロパティには上下左右の概念はありません。 アウトラインをつける（縁取りをする）対象が丸い場合には、アウトラインも丸くなります。 ■アウトラインスタイルの値
■アウトライン太さの値
■アウトライン色の値
■使用例スタイルシート部分は外部ファイル（sample.css）に記述。input.sample1 {outline: solid 1px #0000ff;}input.sample2 {outline: double 2px #ff0000;} input.sample3 {outline: groove 3px #ff0000;} input.sample4 {outline: inset 4px #ffff00;} input.sample5 {outline: dotted 5px invert;} HTMLソース<html><head> <link rel="stylesheet" href="sample.css" type="text/css"> </head> <body> <form action="cgi-bin/aaa.cgi" method="post"> <b> 名前：</b><br> <input class="sample1" type="text" name="name" size="30"><br> <b> パスワード：</b><br> <input class="sample2" type="password" name="pass" size="6"><br> <b>学年：</b><br> <input class="sample3" type="radio" name="gakunen" value="１年生">１年生 <input class="sample3" type="radio" name="gakunen" value="２年生">２年生 <input class="sample3" type="radio" name="gakunen" value="３年生">３年生 <input class="sample3" type="radio" name="gakunen" value="４年生">４年生 <input class="sample3" type="radio" name="gakunen" value="５年生">５年生 <input class="sample3" type="radio" name="gakunen" value="６年生">６年生<br> <b>好きな課目：</b><br> <input class="sample4" type="checkbox" name="kamoku" value="国語">国語 <input class="sample4" type="checkbox" name="kamoku" value="英語">英語 <input class="sample4" type="checkbox" name="kamoku" value="算数">算数 <input class="sample4" type="checkbox" name="kamoku" value="理科">理科 <input class="sample4" type="checkbox" name="kamoku" value="社会">社会 <input class="sample4" type="checkbox" name="kamoku" value="体育">体育<br> <b>宿題ファイル：</b><br> <input class="sample5" type="file" name="syukudai"><br> <input type="submit" value="送信"> <input type="reset" value="リセット"> </form> </body> </html> ↓↓↓ ブラウザ上の表示■関連項目
outline･･････････････････････アウトラインのスタイル・太さ・色を指定する
outline-color････････････････アウトラインの色を指定する outline-style････････････････アウトラインのスタイルを指定する outline-width････････････････アウトラインの太さを指定する |
トップページ > スタイルシートリファレンス > outline
|
©2012 HTMQ