CSS3 User Interface
CSS3 User Interface
In CSS3, die Erhöhung der Zahl der neuen Funktionen der Benutzeroberfläche, die Elementgröße, Bildgröße und Außengrenzen einzustellen.
In diesem Kapitel finden Sie die folgenden Benutzeroberfläche Eigenschaften erfahren:
- Größe ändern
- Box-Sizing
- outline-Offset
Browser-Unterstützung
Die Zahlen in der Tabelle stellen die erste Browser die Versionsnummer der Immobilie zu unterstützen.
Unmittelbar im Anschluss an die digitale -webkit-, -MS- oder vor zur Unterstützung der Präfix Attributnummer erste Browser-Version -moz-.
属性 | |||||
---|---|---|---|---|---|
resize | 4.0 | 不兼容 | 5.0 4.0 -moz- |
4.0 | 15.0 |
box-sizing | 10.0 4.0 -webkit- |
8.0 | 29.0 2.0 -moz- |
5.1 3.1 -webkit- |
9.5 |
outline-offset | 4.0 | 不兼容 | 5.0 4.0 -moz- |
4.0 | 9.5 |
CSS3 Redimensionierung (Ändern der Größe)
In CSS3, die Größe Eigenschaft gibt an, ob ein Element sollte der Anwender die Größe anzupassen.
CSS-Code ist wie folgt:
Beispiele
Ein div-Element durch den Benutzer Größe angegeben:
{
resize:both;
overflow:auto;
}
Versuchen »
CSS3 resize (Feld Sizing)
Box-Sizing-Eigenschaft ermöglicht es Ihnen, den genauen Inhalt eines bestimmten Bereichs der Anpassung zu definieren.
Beispiele
Die Rückstellungen von zwei nebeneinander mit einem Rand-Block:
{
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
width:50%;
float:left;
}
Versuchen »
CSS3 modifizierte Form (outline-Offset)
outline-Offset-Eigenschaft Offsetkontur und das Profil über den Rand der Grenze zu ziehen.
Es gibt zwei verschiedene Kontur und Rahmen:
- Contour nicht besetzen Raum
- Es kann nicht rechteckigen Umriss sein
Der CSS-Code ist wie folgt:
Beispiele
Bestimmungen außerhalb der Konturpixel am Rand der Grenze 15:
{
border:2px solid black;
outline:2px solid red;
outline-offset:15px;
}
Versuchen »
Die neuen Funktionen der Benutzeroberfläche
Immobilien | Erklärung | CSS |
---|---|---|
Aussehen | Es ermöglicht Ihnen, das Aussehen eines Elements wie ein Standard-Elemente der Benutzeroberfläche zu machen | 3 |
Box-Sizing | Es ermöglicht Ihnen, die Region anzupassen und bestimmte Elemente in irgendeiner Weise zu definieren, | 3 |
Symbol | Die Schöpfer des Elements wird entsprechende Kapazität zu Symbol. | 3 |
nav-down | Gibt an, wo zu navigieren, wenn mit den Pfeiltasten nach unten zu navigieren | 3 |
nav-Index | Gibt an, dass ein Element der Ordnung Tab | 3 |
nav-links | Bestimmen Sie, wo die linke Pfeilnavigationstasten zum Navigieren | 3 |
nav-Recht | Bestimmen Sie, wo die rechte Pfeilnavigationstasten verwenden, um zu navigieren | 3 |
nav-up | Gibt an, wo zu navigieren, wenn mit den Pfeiltasten nach oben zu navigieren | 3 |
outline-Offset | Außenkontur Modifizierte und den Rand der Grenze ziehen über | 3 |
Größe ändern | Gibt an, ob ein Element durch den Benutzer geändert wird | 3 |