Heim > Web-Frontend > CSS-Tutorial > Hauptteil

CSS von A bis Z

WBOY
Freigeben: 2024-08-06 01:21:49
Original
922 Leute haben es durchsucht

An A to Z of CSS

Dies ist inspiriert, als ich in ein Zimmer ging und meine Eltern und mein Neffe dabei waren, die versuchten, Autos von A bis Z zu machen.

Eine Zugänglichkeit

Was viele Leute vergessen, aber meiner Meinung nach genauso wichtig ist wie Reaktionsfähigkeit.

B-Block

Senkrecht zur Schreibrichtung.

C berechnet

Berechnungen in CSS durchführen. Sehr praktisch.

D-Anzeige

Block, Inline, Inline-Block, Flex, Inline-Flex, Gitter, Inline-Gitter, keine usw.

E: leer

Eine nützliche Pseudoklasse zum Gestalten von Elementen ohne untergeordnete Elemente. Solange sie keinen Leerraum enthalten.

F-Flexbox

Als ich zum ersten Mal mit CSS begann, lernte ich, indem ich mir den Inspektor ansah und mit Dingen spielte. Und dann habe ich jemanden kopiert, der seine Layouts mit Floats gemacht hat. Und es war so schwer, die Dinge zu positionieren. Das Erlernen von Flexbox machte den Unterschied.

G-Gitter

Was sich für mich immer noch wie der kompliziertere und leistungsfähigere Bruder von Flexbox anfühlt.

H-Höhe

Wie viel Platz nimmt etwas horizontal ein.

Ich inline

Die Schreibrichtung. Wirklich nützlich zum Zentrieren, wo Sie margin-inline: auto verwenden können.

J rechtfertigen

In Flexbox Zombies verwenden Sie Ihren Justify-Laser, um Zombies in die Richtung zu zielen, in die Sie schießen.

K @keyframes

Animationsschritte.

L Zeilenhöhe

Kann Text völlig unlesbar erscheinen lassen, wenn er zu groß oder zu klein ist.

M-Marge

Raum um ein Element, der das Element nicht größer macht.

N keine

Nützlich, um die Anzeige von etwas zu stoppen oder Ränder zu entfernen.

O objekttauglich

Obwohl es den Anschein hat, als gäbe es das schon ewig, bin ich vor einiger Zeit auf etwas gestoßen, das relativ war. Es enthielt etwas JavaScript, das jemand geschrieben hatte, um damit umzugehen, dass Object-Fit neu war und noch nicht in allen Browsern funktionierte.

P-Polsterung

Abstand um das Element herum, der das Element größer macht. Negative Polsterung ist nicht so etwas wie ein negativer Rand.

Q-Abfragen

Medienabfragen und Containerabfragen, die für responsives Design und Barrierefreiheit verwendet werden.

R Reaktionsfähigkeit

Wichtig, um sicherzustellen, dass Ihre Website auf alle Bildschirme passt. Scheint ziemlich einfach zu sein, aber es gibt viele Websites, die bei manchen Größen nicht richtig passen.

S-Spezifität

Dies wird problematisch, wenn Sie versuchen, Stile von Drittanbietern zu überschreiben. Allerdings habe ich kürzlich einige CMS-Plugins gesehen, die :where verwenden, was sehr hilfreich ist.

T-Text

Wird manchmal für die Schriftgestaltung verwendet. Und manchmal verwendet man Schriftarten. Es sei denn, Sie möchten die Farbe des Textes ändern. In diesem Fall ist dies nicht der Fall.

U-Einheiten

Die am häufigsten verwendeten davon sind %, px, em und rem. Auch fr in Rastern und s und ms in Übergängen und Animationen.

V-Sichtbarkeit

Interessant, das Gegenteil von sichtbar ist verborgen. Was nicht das ist, was man logischerweise annehmen würde.

W-Breite

Wie viel Platz nimmt etwas horizontal ein.

X-Überlauf-x

Ein bisschen wie ein Trick für x, aber es beginnt nichts mit x. Dies steuert den horizontalen Überlauf. x wird auch mit Tailwind verwendet, wobei mx beispielsweise der horizontale Rand ist.

Y überlauf-y

Wie bei x steuert dies den vertikalen Überlauf. Und y soll im Allgemeinen die Vertikale in Rückenwind bezeichnen.

Z Z-Index

Der höchste/niedrigste Z-Index, den Sie verwenden können, ist (-)2.147.483.647. Oder die Unendlichkeit wird dir dasselbe geben. Aber eine Menge Neunen einzugeben und sich dann zu fragen, warum es nicht funktioniert, ist eine viel einfachere Methode.

Das obige ist der detaillierte Inhalt vonCSS von A bis Z. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!