Eigenschap outline

De eigenschap outline stelt de kleur, het type en de dikte in voor de externe rand (rand die geen ruimte inneemt) voor alle zijden tegelijk, maar in tegenstelling tot border breidt een dergelijke rand het element niet uit. Het is een korte notatie voor de eigenschappen outline-width, outline-style en outline-color (maar niet voor outline-offset).

Syntaxis

cssselector {
  outline: dikte type kleur;
}

De volgorde van de waarden maakt niet uit.

Voorbeeld . Alleen outline

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

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

Результат:

Voorbeeld . Eigenschappen outline en border samen

De rand van outline zal aan de buitenkant zijn, en de rand van border - aan de binnenkant:

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

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

Результат:

Zie ook