Savybė outline

Savybė outline nurodo spalvą, tipą ir storį išorinei kontūrinei linijai (kuri neužima vietos) visoms pusėms vienu metu, bet skirtingai nei border tokia kontūrinė linija neišplečia elemento. Yra sutrumpinta savybė outline-width, outline-style ir outline-color (bet ne outline-offset).

Sintaksė

cssselektorius {
  outline: storis tipas spalva;
}

Savybių tvarka neturi reikšmės.

Pavyzdys . Tik outline

html<div id="elem"></div>

css#elem {
  outline: 1px solid black;
  width: 300px;
  height: 100px;
}

Результат:

Pavyzdys . Savybės outline ir border kartu

Kontūrinė linija nuo outline bus išorėje, o rėmelis nuo border - viduje:

html<div id="elem"></div>

css#elem {
  outline: 4px solid green;
  border: 4px solid red;
  width: 300px;
  height: 100px;
}

Результат:

Taip pat žiūrėkite