| スタイルシートを直接指定する | |||||||||
<タグ style=""> | |||||||||
スタイルシートの指定方法は、①タグに直接書き込む場合、②<head>～</head>内に記述する場合、③外部スタイルシートファイルを使用する場合の３通りが有ります。 | |||||||||
スタイルシートをタグに直接書き込む場合は、タグに "style" 属性を追加します。 | |||||||||
<タグ style="Font-Size:10.5pt; Color:red"> ～ </タグ> | |||||||||
| |||||||||
 この属性を使用する場合は、<head>～</head>内に次の行を記述して下さい。
<meta http-equiv="Content-Style-Type" content="text/css"> | |||||||||
■スタイルシートの記述例 | |||||||||
<span style="Font-Size:10.5pt; Color:red">
→フォントサイズを "10.5" ポイント、文字色を "赤" に指定した例です。 | |||||||||
<hr style="Border-Top:red 1px dashed; Border-Bottom:red 1px dashed;">
→水平線の色を "赤" 、線の太さを "2" ピクセル、線のスタイルを "波線" に指定した例です。 | |||||||||
| ★ <meta>タグの記載位置 | |||||||||
| |||||||||
| 関連するページ | |||||||||
HTML タグページ  ：スタイルシート言語を指定する（<meta>）
HTML タグページ ：スタイルシートを指定する（<style>）
HTML タグページ ：外部スタイルシートファイルを読み込む（<link>） | |||||||||
Utilety Page (参考) ：「スタイルシート（CSS）の使い方」へ | |||||||||
| スタイルシートを間接的に指定する | |||||||||||||||||||||||||||
<タグ class=""> | |||||||||||||||||||||||||||
スタイルシートを指定するときに使用する属性です。この属性を使用すると、別の場所に記述されたスタイルシートの指定を適用させることができます。 | |||||||||||||||||||||||||||
<タグ class="StyleName"> ～ </タグ> | |||||||||||||||||||||||||||
| |||||||||||||||||||||||||||
＊ クラス名は、ピリオド（ . ）で書き始めます。ひとつのクラス名は複数のタグで使用することができます。また、1つのタグに複数のクラス名を指定することもできます。 | |||||||||||||||||||||||||||
＊ この属性は、ほとんどのタグで使用できます。 | |||||||||||||||||||||||||||
| ★ 使用例とブラウザでの表示 | |||||||||||||||||||||||||||
| |||||||||||||||||||||||||||
| 関連するページ | |||||||||||||||||||||||||||
| HTML タグページ ：スタイルシートを指定する（<style>）
HTML タグページ ：外部スタイルシートファイルを読み込む（<link>） | |||||||||||||||||||||||||||
| Utilety Page (参考)：「スタイルシート（CSS）の使い方」へ | |||||||||||||||||||||||||||
| 識別名を指定する | |||||||||||||||||||||
<タグ id=""> | |||||||||||||||||||||
ID（識別名）を指定するときに使用する属性です。
識別名を指定しておくと、特定の部分に対してスタイルシートを適用させたり、JavaScript からの参照先を指定できるようになります。 | |||||||||||||||||||||
<タグ id="IDname"> ～ </タグ> | |||||||||||||||||||||
| |||||||||||||||||||||
＊ ID（識別名）は、ハッシュ（ # ）で書き始めます。JavaScript の参照先を指定する場合、ひとつのIDは１ページ内で一度しか使用できません。（ページ内でIDが重複しないように使用します。） | |||||||||||||||||||||
＊ この属性は、ほとんどのタグで使用できます。 | |||||||||||||||||||||
| ★ 使用例とブラウザでの表示 | |||||||||||||||||||||
| |||||||||||||||||||||
| 関連するページ | |||||||||||||||||||||
| HTML タグページ ：スタイルシートを指定する（<style>）
HTML タグページ ：外部スタイルシートファイルを読み込む（<link>） | |||||||||||||||||||||
| Utilety Page (参考)：「スタイルシート（CSS）の使い方」へ | |||||||||||||||||||||
| マウスのポイントで説明文を表示する | |||||||||||||||||
<タグ title=""> | |||||||||||||||||
この属性を指定することによって、指定した部分にマウスポインタを重ねる合わせると「説明文」を表示するようになります。 | |||||||||||||||||
<タグ title="説明文"> ～ </タグ> | |||||||||||||||||
| |||||||||||||||||
＊ この属性は、ほとんどのタグで使用できます。 | |||||||||||||||||
【説明文の表示例】 | |||||||||||||||||
<a href="#exam" title="title属性にジャンプします">説明文の表示へ</a>
→ 説明文の表示へ ＊ リンクボタン「説明文の表示へ」にマウスポインタを重ねて下さい。ワンテンポ遅れて「title属性にジャンプします」を表示します。
| |||||||||||||||||
| ★ 使用例とブラウザでの表示 | |||||||||||||||||
| |||||||||||||||||
|
| ショートカットキーを割り当てる | |||||||||||||||
<タグ accessKey=""> | |||||||||||||||
この属性を指定すると、アルファベットキーなどにショートカットキーを割り当てることができます。
※ 数字キーも指定できますが、［Tab］キーによる移動順序 と混同するので避けて下さい。 | |||||||||||||||
<タグ accessKey="設定値"> ～ </タグ> | |||||||||||||||
| |||||||||||||||
【ショートカットキーの指定例】 | |||||||||||||||
この例では、リンクボタンに ［J］キーを割り当てています。 | |||||||||||||||
これを Windows で操作する場合、次のようになります。 | |||||||||||||||
Internet Exp.の場合：［Alt］キーを押しながら､［J］キーを押します｡
Firefoxの場合：［Alt］キーと［Shift］キーを押しながら､［J］キーを押します。  Operaの場合：［Shift］キーと［Esc］キーを同時に押すと、右のようなメニューを表示するので、［J］キーなどを押して下さい。 | |||||||||||||||
【指定できるタグ】 | |||||||||||||||
この属性は、リンク（<a>タグ、<area>タグ）やフォームの部品（<input>タグ、<textarea>タグ、<button>タグ、<label>タグ、<legend>タグ）などで使用することができます。 | |||||||||||||||
【ショートカットキーを割り当てる際の留意点】 | |||||||||||||||
※ リンク文字（ショートカットキー（J））部分の（J）は、このリンクに割り当てられたキーをユーザーに伝えるためのものです。これは、Windows 上で動くアプリケーションのメニューバーやダイアログに共通して用いられている表示方法です。例えば、ファイル（F）、編集（E）、表示（V）、ツール（T）、ヘルプ（H）などです。ブラウザではこの他に、お気に入り（A）、アドレス（D）などがショートカットキーとして割り当てられています。
※ ブラウザのメニューバーと同じキーを割り当てた場合、ホームページで指定したキーの割り当てが優先します。しかし、ショートカットキーを常時使用するユーザもいますので、重複は避けて下さい。 もちろん、同一ページでの重複も避けて下さい。 | |||||||||||||||
【Windows アプリケーションに共通のショートカットキー】（参考） | |||||||||||||||
※ プルダウンメニューやサブメニューで表示する、開く（O）、ページ設定（U）、印刷（P）などは、［O］キー、［U］キー、［P］キーなどを単独で操作します。
プルダウンメニューやサブメニューを表示しているときに機能します。 ※ ①ファイル(F)のプルダウンメニューで表示する、開く（Ctrl+O）、上書き保存（Ctrl+S）、印刷（Ctrl+P）や②編集(E)のプルダウンメニューで表示する、切り取り（Ctrl+X）、コピー（Ctrl+C）、貼り付け（Ctrl+V）などは、［Ctrl］キーを押しながら操作するショートカットキーです。
この機能はグローバル設定で、プルダウンメニューを表示していない場合でも有効です。 | |||||||||||||||
| ★ 使用例とブラウザでの表示 | |||||||||||||||
| |||||||||||||||
|
| Tabキーによる移動順序を指定する | |||||||||||||||
<タグ tabIndex=""> | |||||||||||||||
この属性を指定すると、［Tab］キーによるフォーカス（カーソル）の移動順序を指定することができます。 | |||||||||||||||
<タグ tabIndex="1" ～ </タグ> | |||||||||||||||
| |||||||||||||||
＊ ［Tab］キーを押すと、小さい数字から順にフォーカス（カーソル）が移動していきます。
※ tabIndex="0" を指定した場合は、「自動的に設定された箇所」と同じ扱いになります。 | |||||||||||||||
【指定できるタグ】 | |||||||||||||||
この属性は、リンク（<a>タグ、<area>タグ）、フォームの部品（<input>タグ、<textarea>タグ、<button>タグ、<select>タグ）、データの埋め込み（<object>タグ）などで使用することができます。 | |||||||||||||||
【移動順序を指定する際の留意点】 | |||||||||||||||
※ ［Tab］キーによる移動順序を指定する際には、"１"から順に指定して下さい。
それは、ページ内の全てのリンク箇所、入力欄、チェックボックス、ラジオボックスに移動順序が設定されるので、"１"から順に指定することで指定箇所に優先して移動させるためです。 ※ また、リンク箇所が多いページでは、「移動順序指定」の部分を別ページにすることが望ましい。それは、移動順が「指定箇所１」→「指定箇所ｎ」→「自動的に設定された箇所」→「指定箇所１」となり、「指定箇所」へ早く戻すことできるからです。
※ 別ページにする方法は、アンケートなどの記入項目が多いページで、入力後に全体の整合性などを推考し、入力内容を修正するときなどに有効です。 | |||||||||||||||
| ★ 使用例とブラウザでの表示 | |||||||||||||||
| |||||||||||||||