ホームページ  >  記事  >  ウェブフロントエンド  >  ボーダースタイル属性の概要

ボーダースタイル属性の概要

高洛峰
高洛峰オリジナル
2017-03-17 09:53:383115ブラウズ

border-style 属性は、要素のすべての境界線のスタイルを設定するか、各辺の境界線スタイルを個別に設定するために使用されます。

境界線は、この値が none でない場合にのみ表示されます。

例1

border-style:dotted solid double dashed;
  • 上の境界線は点線です

  • 右の境界線は実線です

  • 下の境界線は二重線です

  • 左の境界線は点線です

例2

border-style:dotted solid double;
  • 上の境界線は点線です

  • 左右の境界線は実線です

  • 下の境界線は二重線です

例3

border-style:dotted solid;
  • 上下の境界線は点ですテッド

  • 左右の境界線は実線です

例4

border-style:dotted;
  • 4つの境界線はすべて点線です

デフォルト: 指定されていません
継承: いいえ
バージョン: CSS1
JavaScript構文: object.style.borderStyle="dotted double"

可能な値

説明
none 国境を定義しません。
hidden は「なし」と同じです。ただし、テーブルに適用される場合は例外で、境界線の競合を解決するために非表示が使用されます。
点線 点線の境界線を定義します。ほとんどのブラウザでは実線として表示されます。
dashed は破線を定義します。ほとんどのブラウザでは実線として表示されます。
solid は実線を定義します。
double は二重線を定義します。二重線の幅は、border-width の値と同じです。
groove 3D 溝の境界線を定義します。効果はborder-colorの値によって異なります。
ridge 3D リッジの境界線を定義します。効果はborder-colorの値によって異なります。
inset 3D 差し込み枠を定義します。効果はborder-colorの値によって異なります。
アウトセット 3D アウトセットの境界線を定義します。効果はborder-colorの値によって異なります。
inherit は、境界線のスタイルを親要素から継承する必要があることを指定します。

説明

最も予測不可能な境界線スタイルは二重です。これは、2 つの線の幅に、border-width 値に等しい 2 つの線の間のスペースを加えたものとして定義されます。ただし、CSS 仕様では、一方の線が他方の線よりも太いのか、両方の線が同じ太さであるべきなのか、また、線の間のスペースが線よりも太いのかどうかについては規定されていません。これらはすべてユーザー エージェントによって決定され、クリエイティブはこの決定に影響を与えません。

以上がボーダースタイル属性の概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。