Acht CSS-Layout-Fähigkeiten, die Sie beherrschen müssen, wenn Sie Webseiten erstellen_Erfahrungsaustausch

1. Wenn Sie Fragen haben, überprüfen Sie sofort

Wenn Sie bei Auftreten eines Fehlers eine einfache Überprüfung des Originalcodes durchführen können, können Sie sich viel Ärger ersparen. W3C verfügt über Erkennungstools für XHTML und CSS, siehe http://validator.w3.org. Bitte beachten Sie, dass Fehler am Anfang der Datei aufgrund einer falschen Struktur und anderer Faktoren zu weiteren Fehlern führen können. Wir empfehlen, zuerst einige der offensichtlichsten Fehler zu beheben und dann eine erneute Überprüfung durchzuführen, um die Anzahl der Fehler zu verringern.

2. Denken Sie daran, die Anweisungen entsprechend zu löschen, wenn Sie die Floating-Funktion verwenden.

Floating ist eine gefährliche Funktion und führt möglicherweise nicht zu den erwarteten Ergebnissen. Wenn Sie auf schwebende Elemente stoßen, die über den Rand des umgebenden Containers hinausragen, oder auf andere ungewöhnliche Situationen, stellen Sie sicher, dass Sie es richtig machen. Sehen Sie sich das Tutorial von Eric Meyer bei Complex Spiral Consulting Web an.

3. Verwenden Sie Polsterung oder Rand, um überlappende Ränder zu vermeiden.

Möglicherweise haben Sie Schwierigkeiten, etwas Platz zu finden, der nicht vorhanden sein sollte, oder Sie können ihn nicht nutzen drücke es raus, egal was passiert. Wenn Sie Ränder verwenden, können die Grenzen leicht überschritten werden. Andy Budd erklärt auf seiner Website, was möglich ist.

4. Vermeiden Sie die gleichzeitige Angabe von Abstand/Rahmen und Höhe oder Breite für Elemente.

Die Windows-Version von IE verursacht häufig Berechnungsprobleme mit Breite und Höhe. Es gibt einige Möglichkeiten, dieses Problem zu lösen. Wenn das übergeordnete Element jedoch die Höhe und Breite angeben muss, ist es am besten, einen Rand auf die untergeordneten Elemente innerhalb des übergeordneten Elements anzuwenden, oder wenn das untergeordnete Element die Höhe und Breite angeben muss, Wenden Sie Polsterung auf das übergeordnete Element an, um diesen Effekt zu erzielen.

5. Verlassen Sie sich nicht auf Mindestbreite/Mindesthöhe

Die Windows-Version von IE unterstützt nicht beide Syntaxen. Bis zu einem gewissen Grad kann die Windows-Version des IE jedoch einen Effekt erzielen, der der Mindestbreite/Mindesthöhe entspricht. Solange Sie also im IE etwas filtern, können Sie die gewünschten Ergebnisse erzielen.

6. Reduzieren Sie im Zweifelsfall zuerst den Prozentsatz

Manchmal führen einige Fehler dazu, dass aus 50 % + 50 % 100,1 % werden, was zu Problemen auf der Webseite führt. Versuchen Sie zu diesem Zeitpunkt, diese Werte auf 49 % oder sogar 49,9 % zu ändern.

7. Denken Sie an die Schreibweise von „TROuBLed“

Rand, die Abkürzungssyntax von Rand und Polsterung hat eine bestimmte Reihenfolge, beginnend von oben und im Uhrzeigersinn: oben, rechts, unten, Also margin :0 1px 3px 5px; Das Ergebnis ist kein Rand oben, 1 Pixel rechts und so weiter. Denken Sie an „TROUBLE“, dann werden Sie die Reihenfolge nicht falsch verstehen.

8. Solange der Wert nicht Null ist, muss die Einheit angegeben werden

CSS erfordert die Angabe der Einheit für jede Schriftart, jeden Rand und andere Werte. (Die einzige Ausnahme ist die Zeilenhöhe)