CSS-Umrissversatz


Inhaltsverzeichnis

    Inhaltsverzeichnis anzeigen


CSS-Umrissversatz

Die Eigenschaft outline-offset fügt Platz hinzu zwischen einem Umriss und dem Rand/Rand eines Elements. Der Raum zwischen einem Element und sein Umriss ist transparent.

Das folgende Beispiel gibt einen Umriss 15 Pixel außerhalb der Randkante an:

This paragraph has an outline 15px outside the border edge.

Beispiel

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

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<head>
<style>
p {
  margin: 30px;
  border: 1px solid black;
  outline: 1px solid red;
  outline-offset: 15px;
}
</style>
</head>
<body>

<h2>The outline-offset Property</h2>

<p>This paragraph has an outline 15px outside the border edge.</p>

</body>
</html>


Das folgende Beispiel zeigt den Abstand zwischen einem Element und seinem Umriss ist transparent:

This paragraph has an outline of 15px outside the border edge.

Beispiel

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

Probieren Sie es selbst aus →

<!DOCTYPE html>
<html>
<head>
<style>
p {
  margin: 30px;
  background:yellow;
  border: 1px solid black;
  outline: 1px solid red;
  outline-offset: 15px;
}
</style>
</head>
<body>

<h2>The outline-offset Property</h2>

<p>This paragraph has an outline of 15px outside the border edge.</p>

</body>
</html>





Alle CSS-Gliederungseigenschaften

outline

Eine Abkürzungseigenschaft zum Festlegen von Umrissbreite, Umrissstil und Umrissfarbe in einer Deklaration

outline-color

Legt die Farbe einer Kontur fest

outline-offset

Gibt den Abstand zwischen einem Umriss und der Kante oder dem Rand eines Elements an

outline-style

Legt den Stil einer Gliederung fest

outline-width

Legt die Breite einer Kontur fest