Sammlung der wichtigsten klassischen und häufig verwendeten CSS-Eigenschaften_Erfahrungsaustausch

Text an beiden Enden ausrichten:

Code kopieren Der Code lautet wie folgt:

text-align :justify;
text-justify:inter-ideograph;

Float löschen:

Code kopieren Der Code lautet wie folgt:

.clear{clear:both;line-height:0;height:0;font-size:0;}

Floating-Pseudoklasse löschen:

Code kopieren Der Code lautet wie folgt:

.clearfix:after{content: " .";display: block;height: 0;clear: Both;visibility: versteckt;}

Eingestellt, um zu verhindern, dass Wörter unterbrochen werden

Code kopieren Der Code lautet wie folgt:

word-break: keep-all

Zeichen automatisch umbrechen

Code kopieren Der Code lautet wie folgt:

word-break:keep-all;word-break:break- all;word-wrap:break-word

Verwenden Sie die Zeilenhöhe, um vertikal zu zentrieren

Code kopieren Der Code lautet wie folgt:

line-height:24px;/*Bei Verwendung Wenn Sie einen Container mit fester Breite haben und eine Linie vertikal zentriert sein muss, verwenden Sie line-height (die Höhe ist dieselbe wie beim übergeordneten Container). Eine Zusammenfassung der vertikalen Zentrierung finden Sie hier.
*/

Container-Floats löschen

Code kopierenCode Wie folgt:

#main {overflow:hidden;}

Umbrechen von Links nicht zulassen

Code kopieren Der Code lautet wie folgt:

a {white-space:nowrap;}

Firefox immer Bildlaufleisten anzeigen lassen

Code kopieren Der Code lautet wie folgt:

html {overflow:- moz-scrollbars-vertical;}

Das Blockelement horizontal zentrieren

Code kopieren Der Code lautet wie folgt:

body, html {min-height:101%;} or margin:0 auto;
Bildlaufleiste des Explorer-Textbereichs ausblenden

Code kopieren Der Code lautet wie folgt:textarea {overflow:auto;}

Druckseite festlegen

Code kopieren Der Code lautet wie folgt:h2 {page-break-before:always;}/*Seitenumbruch beim Drucken von Webseiten festlegen*/

Entfernen Sie das gepunktete Kästchen auf dem Link

Code kopieren Der Code lautet wie folgt:a, area { blr:expression(this.onFocus=this.blur()) }

:focus { -moz-outline-style: none }

Der einfachste CSS-Reset

Code kopieren Der Code lautet wie folgt: * {margin: 0; padding: 0}/*Verwenden Dieses Attribut ist mit Vorsicht zu genießen. Obwohl es das Standardattribut eliminieren kann, hat es Auswirkungen auf das Browser-Rendering und ist auch nicht semantisch ausgedrückt. +/ >Der Code lautet wie folgt:

img{vertical-align:top;}

Atribut lutsinar

Salin kod Kodnya adalah seperti berikut:

penapis:alpha(opacity=50);

Tukar tetikus kepada bentuk tangan

Salin kod Kod adalah seperti berikut :

kursor:tangan;