CSS のアウトライン:なしの詳細な紹介

要素がフォーカスを取得すると、フォーカスフレームは0になります。
たとえば、この現在のWebページでは、タブキーを使用して切り替えると、テキストリンク、検索ボックスの外側に点線の枠（または強調表示された枠）が表示されます。 、ボタンなど。この時点で、現在の要素にフォーカスがあり、それを操作できるようになります。
この機能は通常、キーボード操作を使用するユーザー向けに用意されています。
画像リンクなどの一部のリンクで、点線枠が表示されてデザインが崩れたくない場合は、この方法を使用できます。

デザインの美観に影響を与える場所にのみ使用し、取り外さないことをお勧めします。結局のところ、このフォーカス ボックスはキーボード ユーザーにとって非常に役立ちます。

定義と使用法
アウトライン スタイル属性は、要素のアウトライン全体のスタイルを設定するために使用されます。スタイルを none にすることはできません。それ以外の場合、アウトラインは表示されません。

アウトライン (輪郭) は、要素の周囲に描かれた線で、境界線の外側に位置し、要素を強調表示できます。アウトライン属性は、要素の周囲にアウトラインを設定します。

注: 常に、outline-color 属性の前に、outline-style 属性を宣言します。要素の輪郭の色は、輪郭を取得した後にのみ変更できます。

注: 等高線はスペースを占有せず、必ずしも長方形である必要はありません。

デフォルト値: なし

アウトラインのスタイルを設定します:

p
  {
  outline-style:dotted;
  }

ブラウザのサポート
すべての主要なブラウザは、アウトライン スタイル属性をサポートしています。

Internet Explorer は、!DOCTYPE が指定されている場合にのみ、アウトライン スタイル属性をサポートします。
可能な値
値の説明
デフォルトは何もありません。アウトラインを定義しません。
dotted はドットの輪郭を定義します。
dashed は、破線のアウトラインを定義します。
solid は実線のアウトラインを定義します。
double は二重線のアウトラインを定義します。二重線の幅は、outline-width の値と同じです。
groove は 3D 溝プロファイルを定義します。この効果は、outline-color 値によって異なります。
リッジは 3D リッジ プロファイルを定義します。この効果は、outline-color 値によって異なります。
インセットは 3D 凹面エッジ プロファイルを定義します。この効果は、outline-color 値によって異なります。
outset は 3D 凸エッジのアウトラインを定義します。この効果は、outline-color 値によって異なります。
inherit は、アウトライン スタイル設定を親要素から継承することを指定します。

以上がCSS のアウトライン:なしの詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。