A border CSS tulajdonság rövidítése

Akárcsak a betűtípusoknál, a szegélyeknél is létezik egy rövidített tulajdonság, a border, amelyet használhatunk annak helyett, hogy 3 különböző tulajdonságot írnánk a szegély vastagságára, színére és stílusára. Ebben a tulajdonságban egyszerűen felsorolhatjuk a szegély értékeit bármilyen sorrendben.

Nézzük meg egy példán keresztül. Tegyük fel, hogy van egy ilyen szegélyünk:

css#elem {
  border-width: 1px;
  border-style: solid;
  border-color: black;
  width: 300px;
  height: 100px;
}

Írjuk át a rövidített tulajdonsággal:

css#elem {
  border: 1px solid red;
  width: 300px;
  height: 100px;
}