Der Umriss ist nicht wie der Rand am Dokumentenfluss beteiligt. Daher hat das Erscheinen oder Verschwinden des Umrisses keinen Einfluss auf den Dokumentenfluss Das heißt, das Dokument wird nicht erneut geöffnet. Mit Umrissen kann der Browser Teilumrisse zusammenführen, um eine kontinuierliche, aber nicht rechteckige Form zu erstellen. Standardmäßig ist Umriss ein dynamischer Stil, der nur gerendert wird, wenn das Element den Fokus erhält oder aktiviert ist
[Hinweis] Der IE7-Browser unterstützt den
Ähnlich wie bei Rändern ist der grundlegendste Aspekt einer Gliederung der Stil. Wenn eine Gliederung keinen Stil hätte, würde die Gliederung überhaupt nicht existieren. Anders als bei der Umrandung fehlt der Wert: keine gestrichelte | |.inset |.inherit
Anfangswert: keineVererbung: keine Umrissbreite Ähnlich wie bei Rahmen darf die Umrissbreite weder negativ sein, noch kann sie als Prozentwert angegeben werdenoutline-width
Werte: dünn | mittel |. dick |.Im Gegensatz zum Rand hat die Umrissfarbe das Schlüsselwort „invertieren“. Den Umriss umkehren, was bedeutet, dass die Farbe der Pixel, an denen sich der Umriss befindet, vollständig umgedreht wird, sodass der Umriss in verschiedenen Hintergrundfarben sichtbar wird. Tatsächlich wird das Schlüsselwort invert jedoch nur vom IE-Browser unterstützt. Die Umrissfarbe anderer Browser ist die Vordergrundfarbe des Elements selbst
outline-color
Wert:Vererbung : Keine
Der Konturversatz wird verwendet, um den Wert der Versatzposition der Kontur zu definieren. Wenn der Parameterwert eine positive Zahl ist, bedeutet dies, dass die Kontur nach außen verschoben wird; wenn der Parameterwert ein negativer Wert ist, bedeutet dies, dass die Kontur nach innen verschoben wird[Hinweis] Der IE-Browser tut dies nicht support
outline-offset Wert: length | inherit Anfangswert: 0 Gilt für: alle Elemente Vererbung: KeineUmriss Der Umrissumriss ähnelt dem Rahmenattribut des Rahmenstils, sodass der Umrissstil, die Breite und die Farbe gleichzeitig festgelegt werden können . Da ein gegebener Umriss einen einheitlichen Stil, eine einheitliche Breite und eine einheitliche Farbe haben muss, ist Umriss die einzige Abkürzungseigenschaft für Umrisse. Es gibt keine Attribute wie „outline-top“ oder „outline-right“ für den Umriss [Hinweis] Umriss enthält keinen Umriss-Offset, und Umriss-Offset muss separat eingestellt werden Umriss Wert: [
Seitenlayout
, sodass Sie mithilfe der Umrisslinie den Randeffekt imitieren können. Aber wenn es einabgerundeter Rand
ist, ist es nicht so einfach. Der Firefox-Browser unterstützt das private Attribut -moz-outline-radius, um die abgerundeten Ecken des Umrisses festzulegen. Die diesem Attribut entsprechende js-Schreibmethode ist MozOutlineRadiusFür andere Browser können wir andere Attribute verwenden, um ähnliche Effekte zu erzielen. Die Attribute box-shadow und border-radius haben denselben Ursprung, das heißt, wenn der border-radius gerundet ist, wird auch die Projektion von box-shadow gerundet
Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Verwendung von CSS-Outlines. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
