コーススケジュール

CSS 短縮表記の境界線

前の章で見たように、境界線を扱う際には考慮すべきプロパティが数多くあります。

コードを節約するために、すべての個々の境界線属性を 1 つの属性で指定することもできます。

border 属性は、次の各境界属性の短縮形です。

p {
  border: 5px solid red;
}

結果：

いくつかのテキスト

片面のみにすべての個別の境界線プロパティを指定することもできます。

p {
  border-left: 6px solid red;
  background-color: lightgrey;
}

结果：

いくつかのテキスト

p {
  border-bottom: 6px solid red;
  background-color: lightgrey;
}

結果：

いくつかのテキスト