CSS links, oben, rechts, unten merken


19

Mit welchen kleinen Tricks haben Sie sich bei der Verwendung von CSS die Reihenfolge von links, oben, rechts und unten merken können, wenn Sie kombinierte CSS-Attribute wie Rahmen, Rand und Abstand definieren.

Ich vergesse für immer und Google scheint mit Mist wie W3Schools gefüllt zu sein.


6
Wie ist w3schools.com "Mist"? Es ist für die Augen einfacher, ihre CSS3-Referenz zu lesen als das Dokument mit den W3C CSS 3-Spezifikationen ...
danlefree

8
@danlefree Eine lange Liste von Beschwerden finden Sie unter W3Fools . (Obwohl ich nicht weiß, dass sie in dieser Frage irgendwo falsch liegen.)
'20.

Danlefee, siehe Su's Antwort. w3schools ist ein Satan zur Förderung des Lernens und der Ressourcen in HTML / CSS / JS. Eine Bewegung ist im Gange, um den Mist von Seite 1 Google fallen zu lassen.
Mâtt Frëëman

2
Ich frage mich, warum niemand Nord, Ost, Süd, West erwähnt hat. Es ist gleichbedeutend mit im Uhrzeigersinn, aber hey :).
Kevin

Antworten:


24

Sie gehen alle im Uhrzeigersinn , beginnend von oben.


4
Mit Ausnahme der Hintergrundpositionierung (die in diesem Fall ein wenig relevant zu sein scheint), wählen Sie zuerst den linken Versatz und dann den oberen Versatz.
Marcel

@Marcel, sehr wahr, was erklärt, warum ich das immer beim ersten Mal falsch verstehe.
John Conde

Die Hintergrundpositionierung wird für x-yKoordinaten geordnet , was bei Verwendung von numerischen Werten sinnvoller ist als bei Verwendung von numerischen Werten left top.
zzzzBov


8

Ich erinnere mich daran, indem ich mir ein Zifferblatt vorstelle: von 12 Uhr (oben) bis 3 Uhr (rechts), dann 6 Uhr (unten) und schließlich 9 Uhr (links).


5

Zusätzlich zur einfachen Wicklungsanalogie biete ich eine andere Mnemonik an: Oben, Rechts, Unten, Links gibt den Initialismus an ausgesprochenen schrecklichen TRBL- an - oder Ärger, wenn Sie möchten . (Hey, selbst Höhen bereiten mir als Bariton Probleme.) Sie passen gut zu CRAP (Contrast, Repetition, Alignment, Proximity), den vier Prinzipien des Sound-Webdesigns.


1
CRAP. Gut gemacht, Sir
Ray Mitchell

2

trainieren

Ich kann mich nicht erinnern, jemals eine spezielle Methode zum Auswendiglernen für diesen kleinen Leckerbissen angewendet zu haben. Ich weiß, dass ich von oben gelernt habe, dass sie im Uhrzeigersinn gesetzt wurden, aber dann habe ich viel CSS geschrieben.

Wenn Sie eine Aufgabe wiederholt ausführen, besteht die Tendenz, sich die Details aus Gründen der Effizienz zu merken.

  1. alle
  2. oben und unten rechts und links
  3. oben rechts & links unten
  4. oben rechts unten links

ist zweite Natur. So wie:

border: <width> <style> <color>;

und

background: <color> <image> <repeat> <attachment> <position>;
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.