ボーダースタイル（CSSプロパティ）

syntax

borderスタイル：{{none| 隠された| 点線| ダッシュ | solid | double | グルーブ| リッジ | inset | 冒険} ^1〜4値 | 継承} ;

説明

速記のプロパティボーダースタイルは、指定された値を使用して、要素の4つの側面すべてに境界線のスタイルを設定します。各境界は独自の価値を持つことができます。略記の順序を覚える簡単な方法のために、略記の特性におけるニーモニック（トラブル）を参照してください。 境界線は要素の背景の上に配置されます。

例

このスタイルのルールには、堅実な境界線が割り当てられます 上部に、底に打ち砕かれた境界線、点線の境界線 IDを使用して要素内の段落の左側と右側 「例」：

#example p {
  border-style: solid dotted dashed;
}

値

• 境界線が表示されないことを意味し、計算された境界線はゼロです。

• 隠しは、2つのセルが境界線を共有し、テーブルセルが境界線を崩壊させた場合にテーブル境界を指す場合を除き、誰とも同じ意味を持ちます（境界線崩壊：崩壊;）。隠された価値は、他のすべての国境スタイルよりも優先されるため、境界線が描かれないことを保証します。セル内の1つの境界に使用されていなかった場合、隣接するセルの境界線が優先されるため、境界線は引き付けられます。詳細については、テーブルのフォーマットを参照してください。

• 点線は、国境を一連の点として実装しています

• 破線は、一連のダッシュとして国境を実装しています。

• しっかりとした境界線を固体線として実装しています。

• 二重の境界線を2つの実線として実装します。 2つの境界幅とそれらの間のスペースの合計は、国境幅に設定された値に等しくなります。

• 溝は、境界がキャンバスに刻まれているという印象を与える3次元効果です。

尾根は、溝がキャンバスから突き出ているように見えるという点で、溝の逆の効果を持つ3D効果です。

• 挿入図は、ボックスがキャンバスに埋め込まれているという印象を与える3D効果です。分離された境界モデルが適用されているテーブルで使用されると、挿入図は、まるでキャンバスに埋め込まれているかのようにボックス全体を見せているように見えます。崩壊するボーダーモデルで使用すると、バリューリッジと同じように扱われます。

• 冒頭は、境界が箱がキャンバスから突き出ているという印象を与えるという点で、挿入図の逆の効果を持つ3D効果です。分離された境界モデルが適用されているテーブルで使用されると、ボーダーは、まるでキャンバスから出てくるようにボックス全体を見せます。崩壊するボーダーモデルで使用されると、溝と同じように動作します。

CSSボーダースタイルに関するよくある質問（FAQ）
CSSのさまざまな種類のボーダースタイルは何ですか？

​​

CSSには、Web要素の外観をカスタマイズするために使用できるいくつかのタイプのボーダースタイルがあります。これらには、「なし」、「隠された」、「点線」、「ダッシュ」、「ソリッド」、「ダブル」、「溝」、「リッジ」、「挿入図」、「冒頭」が含まれます。各スタイルにはユニークな視覚効果があります。たとえば、「ドットド」は一連のドットで境界線を作成し、「ダブル」はダブルラインの境界線を作成します。 > CSSでは、それぞれ「境界線」と「境界線」プロパティを使用して、境界の幅と色を設定できます。たとえば、5ピクセルの境界幅と赤の色を設定するには、次のコードを使用します。 > CSSの「なし」と「隠された」ボーダースタイルの違いは何ですか？
CSSの「なし」と「隠された」ボーダースタイルは似ているように見えるかもしれませんが、微妙な違いがあります。 「なし」とは、境界線が描かれていないことを意味しますが、「隠された」とは、国境が描かれているが見えないことを意味します。この違いは、「隠された」を使用してセル間の境界線を隠すことができるテーブル要素で最も顕著です。 CSSは、「ボーダートップスタイル」、「ボーダーライトスタイル」、「ボーダーボトムスタイル」、および、および「ボーダーボトムスタイル」を使用して、要素のさまざまな側面のさまざまな境界スタイルを指定できます。 「国境左スタイル」のプロパティ。たとえば、上部に固体の境界線を設定し、底部に点線の境界線を設定するには、次のコードを使用します。 ;

cssで速記の「境界」プロパティを使用するにはどうすればよいですか？

​​

cssの速記の「境界」プロパティを使用すると、幅を設定できます。コードの1行の境界線のスタイルと色。構文は「境界：幅スタイルの色;」です。たとえば、5ピクセルのソリッドレッドボーダーを設定するには、次のコードを使用します。

CSSのデフォルトのボーダースタイルは何ですか？

CSSのデフォルトのボーダースタイルは「なし」です。つまり、境界線は描かれていません。要素に境界線を追加する場合は、「なし」以外の境界スタイルを指定する必要があります。 16進数のカラーコードを使用して、CSSの境界色を指定できます。たとえば、境界線の色を水色に設定するには、次のコードを使用します。

ボーダーカラー：＃add8e6;

cssで丸い境界線を作成するにはどうすればよいですか？
「Border-Radius」プロパティを使用して、CSSに丸い境界線を作成できます。このプロパティを使用すると、境界角の半径を設定して、丸みを帯びた効果を生み出します。たとえば、10ピクセルの境界半径を設定するには、次のコードを使用します。


Border-radius：10px;
画像付きのCSSの「Border」プロパティを使用できますか？


はい、CSSの「国境」プロパティを使用して、画像に境界を追加できます。これは、画像を強調表示したり、ページ上の他の要素から分離したりするのに役立ちます。 CSSはもう少し複雑で、線形勾配を備えた背景画像を使用し、パディングとバックグラウンドクリップのプロパティを調整する必要があります。これがあなたがそれを行う方法の例を示します：


.box {

背景：線形勾配（底、赤、青）;

境界線：10px;

境界線-tyle：solid;

border-image：線形勾配（底、赤、青）1;

}

以上がボーダースタイル（CSSプロパティ）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。