Heim > Web-Frontend > CSS-Tutorial > [CSS-Hinweis 8] CSS-Code-Abkürzung, die weniger Bandbreite beansprucht

[CSS-Hinweis 8] CSS-Code-Abkürzung, die weniger Bandbreite beansprucht

黄舟
Freigeben: 2016-12-29 13:55:42
Original
1253 Leute haben es durchsucht

1. Box-Modell-Code-Abkürzung
Denken Sie daran, wenn Sie über das Box-Modell sprechen, werden die Ränder (Margin), die Polsterung (Padding) und der Rand (Rand) in den vier Richtungen oben, unten, links und rechts festgelegt im Uhrzeigersinn Einstellung: oben rechts, unten links. Beispiele für spezifische Anwendungen in Rand und Polsterung sind wie folgt:

margin:10px 15px 12px 14px;/*上设置为10px、右设置为15px、下设置为12px、左设置为14px*/
Nach dem Login kopieren

hat normalerweise die folgenden drei Abkürzungen:

1 , und left sind gleich. Beispielsweise kann der folgende Code:

margin:10px 10px 10px 10px;
Nach dem Login kopieren

abgekürzt werden zu:

margin:10px;
Nach dem Login kopieren

2. Wenn die Werte von top und unten sind gleich, die Werte von links und rechts sind gleich, wie im folgenden Code:

margin:10px 20px 10px 20px;
Nach dem Login kopieren

kann abgekürzt werden als:

margin:10px 20px;
Nach dem Login kopieren

3. Wenn die Werte von links und rechts gleich sind, wie im folgenden Code:

margin:10px 20px 30px 20px;
Nach dem Login kopieren

kann abgekürzt werden als:

margin:10px 20px 30px;
Nach dem Login kopieren

Hinweis: Die Abkürzungsmethoden für Polsterung und Rand sind dieselben wie für den Rand.

2. Farbwertabkürzung
Der CSS-Farbstil kann auch abgekürzt werden, wenn die von Ihnen festgelegte Farbe ein hexadezimaler Farbwert ist, wenn die Werte aller beiden Ziffern gleich sind , Sie können die Hälfte abkürzen.

Beispiel 1:

p{color:#000000;}
可以缩写为:
p{color: #000;}
例子2:
p{color: #336699;}
可以缩写为:
p{color: #369;}
Nach dem Login kopieren

3. Schriftartenabkürzung
Der Schriftart-CSS-Stilcode auf der Webseite verfügt auch über eine eigene Abkürzungsmethode. Im Folgenden finden Sie den Code zum Festlegen der Schriftart für die Webseite:

body{ font-style:italic; font-variant:small-caps; font-weight:bold; font-size:12px; line-height:1.5em; font-family:"宋体",sans-serif; }
Nach dem Login kopieren

So viele Codezeilen können tatsächlich in einem Satz zusammengefasst werden:

body{ font:italic small-caps bold 12px/1.5em "宋体",sans-serif; }
Nach dem Login kopieren

Hinweis:

1. Wenn Sie diese Abkürzung verwenden, müssen Sie mindestens die Eigenschaften „font-size“ und „font-family“ angeben. Andere Eigenschaften (z. B. „font-weight“, „font-style“, „font-varient“, „line-height“) verwenden automatisch den Standardwert, wenn nicht angegeben.

2. Fügen Sie bei Abkürzungen „/“ diagonal zwischen Schriftgröße und Zeilenhöhe hinzu.

Da es für chinesische Websites immer noch relativ wenig Englisch gibt, werden im Allgemeinen häufiger die folgenden Abkürzungscodes verwendet:

body{ font:12px/1.5em "宋体",sans-serif; }
Nach dem Login kopieren

Es gibt nur Schriftgröße, Zeilenabstand, chinesische Schriftart usw Englische Schriftarteinstellungen.

Das Obige ist [CSS-Hinweis 8] CSS-Code-Abkürzung, die weniger Bandbreite beansprucht. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!


Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage