hr, iframe, fieldset
table (gdy element table posiada atrybut border)
td (gdy element td jest elementem potomkiem elementu table posiadającego atrybut border)
th (gdy element th jest elementem potomkiem elementu table posiadającego atrybut border)

animowanie

tak (animacja schodkowa)

Interpretacja właściwości `border-style`

: tak
: tak
: tak
: tak
: tak
: tak

Opis wartości właściwości `border-style`

grupa wartości

Wyjaśnienie

Za pomocą właściwości border-style oraz z góry zdefiniowanej grupy wartości możemy określić styl obramowania jednocześnie po kilku stronach interesującego nas elementu HTML.

/* OBIE REGUŁY CSS SĄ SOBIE RÓWNOZNACZNE */

/* REGUŁA - 1 */
div {
  border-style:solid double dotted dashed;
}

/* REGUŁA - 2 */
div {
  border-top-style:solid;
  border-right-style:double;
  border-bottom-style:dotted;
  border-left-style:dashed;
}

Składniki grupy wartości właściwości `border-style`

            top right bottom left

Przykładowe zapisy

solid

solid double

solid double dotted

solid double dotted dashed

top: Składnik top jest wymaganym składnikiem grupy wartości właściwości border-style. Składnik top określa wartość właściwości border-top-style, czyli styl górnego obramowania interesującego nas elementu HTML.
right: Składnik right jest wymaganym składnikiem grupy wartości właściwości border-style. Składnik right określa wartość właściwości border-right-style, czyli styl prawego obramowania interesującego nas elementu HTML.
bottom: Składnik bottom jest wymaganym składnikiem grupy wartości właściwości border-style. Składnik bottom określa wartość właściwości border-bottom-style, czyli styl dolnego obramowania interesującego nas elementu HTML.
left: Składnik left jest wymaganym składnikiem grupy wartości właściwości border-style. Składnik left określa wartość właściwości border-left-style, czyli styl lewego obramowania interesującego nas elementu HTML.

Przykład

  border-style:solid double;

stylem górnego oraz dolnego obramowania tego elementu "div" jest styl "solid" (pojedyncza ciągła linia), natomiast stylem prawego oraz lewego obramowania tego elementu "div" jest styl "double" (podwójna ciągła linia), ponieważ do tego elementu "div" została dodana właściwość "border-style" wraz z następującą grupą wartości: "solid double"

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        border-width:10px;
        border-style:solid double;
        border-color:black;
        padding:1em;
        font-size:1.3em;
        background-color:#7DCDE8;
      }
    </style>
  </head>

  <body>

    <div>
      stylem górnego oraz dolnego obramowania tego elementu "div" jest styl "solid" (pojedyncza ciągła linia), natomiast stylem prawego oraz lewego obramowania tego elementu "div" jest styl "double" (podwójna ciągła linia), ponieważ do tego elementu "div" została dodana właściwość "border-style" wraz z następującą grupą wartości: "solid double"
    </div>

  </body>
</html>