Heim  >  Artikel  >  Web-Frontend  >  Zusammenfassung der CSS-Nutzungsfähigkeiten

Zusammenfassung der CSS-Nutzungsfähigkeiten

巴扎黑
巴扎黑Original
2017-08-14 15:05:381421Durchsuche

Verwenden Sie line-height für die vertikale Zentrierung

line-height:24px;
Wenn Sie einen Container mit fester Breite verwenden und eine Linie vertikal zentriert werden müssen, verwenden Sie line-height (die Höhe ist die (identisch mit dem übergeordneten Layer-Container), eine Zusammenfassung der vertikalen Zentrierung ist hier zu sehen.

Klare Containerschwimmer

#main { 
overflow:hidden; 
}

Dieses Problem wurde bereits erwähnt. Weitere Informationen finden Sie hier.

Links nicht umbrechen lassen

a { 
white-space:nowrap; 
}

Die oben genannten Einstellungen können das Umbrechen von Links verhindern, ich persönlich empfehle jedoch, dass lange Links entsprechende Zeilen haben (im Zusammenhang mit a (Diskussion von Zeilenumbrüchen, siehe Aufzeichnung des Kreismittelpunkts).

Firefox immer Bildlaufleisten anzeigen lassen

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

Weitere private CSS-Eigenschaften von Mozilla/Firefox finden Sie hier. Für die browserübergreifende Unterstützung können Sie auch

body, html { 
min-height:101%; 
}

verwenden, um das Blockelement horizontal zu zentrieren.

margin:0 auto
ist eigentlich

margin-left: auto;
margin-right: auto;
Grundsätzlich wird diese Technik in allen CSS-Lehrbüchern erklärt. Sie können auch

body{ 
text-align: center; 
}

im Explorer verwenden und dann den inneren Container

text-align: left;
zum Wiederherstellen definieren.

Bildlaufleiste des Exploer-Textbereichs ausblenden

textarea { 
overflow:auto; 
}

Der Explorer-Textbereich verfügt standardmäßig über vertikale Bildlaufleisten (fragen Sie mich nicht warum).

Druckseiten festlegen

h2 { 
page-break-before:always; 
}

Das Attribut „page-break-before“ kann die Seitenanzahl beim Drucken von Webseiten festlegen.

Entfernen Sie den gepunkteten Rahmen auf dem Link

a:active, a:focus { 
outline:none; 
}

Firefox fügt standardmäßig einen gepunkteten Rahmen hinzu, wenn der Link den Fokus erhält (oder wenn darauf geklickt wird), den Sie verwenden können Löschen Sie das obige Attribut.

Der einfachste CSS-Reset

* { 
margin: 0; padding: 0 
}

Das obige ist der detaillierte Inhalt vonZusammenfassung der CSS-Nutzungsfähigkeiten. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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