CSS handleiding

CSS TUIS CSS Inleiding CSS-sintaksis CSS-keurders CSS Hoe om CSS Kommentaar CSS kleure CSS agtergronde CSS-grense CSS-marges CSS Opvulling CSS Hoogte/Breedte CSS Box Model CSS uiteensetting CSS teks CSS lettertipes CSS-ikone CSS skakels CSS-lyste CSS-tabelle CSS vertoon CSS maksimum breedte CSS posisie CSS Z-indeks CSS oorloop CSS Float CSS Inline-blok CSS Belyn CSS-kombineerders CSS Pseudo-klas CSS Pseudo-element CSS Deursigtigheid CSS-navigasiebalk CSS-aftrekkies CSS Beeldgalery CSS Beeld Sprites CSS Attr keurders CSS-vorms CSS-tellers CSS-webwerfuitleg CSS-eenhede CSS Spesifisiteit CSS !belangrik CSS Wiskunde funksies

CSS Gevorderd

CSS afgeronde hoeke CSS-randbeelde CSS agtergronde CSS kleure CSS-kleur sleutelwoorde CSS Gradiënte CSS Shadows CSS-tekseffekte CSS Web Fonts CSS 2D-transformasies CSS 3D-transformasies CSS-oorgange CSS-animasies CSS Tooltips CSS-stylbeelde CSS-beeldrefleksie CSS-objekpas CSS voorwerp-posisie CSS-maskering CSS-knoppies CSS-paginering CSS veelvuldige kolomme CSS-gebruikerskoppelvlak CSS veranderlikes CSS-boksgrootte CSS-medianavrae CSS MQ Voorbeelde CSS Flexbox

CSS reageer

RWD Inleiding RWD Uitsigpoort RWD-roosteraansig RWD Media Navrae RWD beelde RWD-video's RWD-raamwerke RWD-sjablone

CSS -rooster

Grid Intro Roosterhouer Rooster item

CSS SASS

SASS Tutoriaal

CSS voorbeelde

CSS-sjablone CSS voorbeelde css vasvra CSS Oefeninge CSS-sertifikaat

CSS Verwysings

CSS Verwysing CSS-keurders CSS-funksies CSS Verwysing Gehoor CSS Web veilige lettertipes CSS Animateerbaar CSS-eenhede CSS PX-EM-omskakelaar CSS kleure CSS-kleurwaardes CSS verstekwaardes CSS-blaaierondersteuning

CSS uiteensetting offset


CSS uiteensetting offset

Die outline-offseteiendom voeg spasie tussen 'n buitelyn en die rand/grens van 'n element by. Die spasie tussen 'n element en sy buitelyn is deursigtig.

Die volgende voorbeeld spesifiseer 'n buitelyn 15px buite die grensrand:

Hierdie paragraaf het 'n buitelyn 15px buite die randrand.

Voorbeeld

p {
  margin: 30px;
  border: 1px solid black;
  outline: 1px solid red;
  outline-offset: 15px;
}

Die volgende voorbeeld toon dat die spasie tussen 'n element en sy buitelyn deursigtig is:

Hierdie paragraaf het 'n buitelyn van 15px buite die rand.

Voorbeeld

p {
  margin: 30px;
  background: yellow;
  border: 1px solid black;
  outline: 1px solid red;
  outline-offset: 15px;
}

Toets jouself met oefeninge

Oefening:

Stel 'n soliede, 5px buitelyngrens vir die <div>-element.

<style>
div {
  : solid;
  : 5px;
}
</style>

<body>

<div>
Lorem ipsum dolor sit amet,
consectetur adipiscing elit,
sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua.
</div>

</body>


Alle CSS Outline-eienskappe

Property Description
outline A shorthand property for setting outline-width, outline-style, and outline-color in one declaration
outline-color Sets the color of an outline
outline-offset Specifies the space between an outline and the edge or border of an element
outline-style Sets the style of an outline
outline-width Sets the width of an outline