CSS macht Front-End-Seitenlayouts, die praktische Tipps besser

3, eine Anpassung der Kompatibilität (IE und Mozilla) dumme Art und Weise:
Anfänger können auftreten, eine Situation, wo die Eigenschaften desselben Etiketts sollen, Anzeige im IE ist normal und in Mozilla festgelegt werden zu B richtig angezeigt, oder zwei auf den Kopf gestellt.
Temporäre Problemumgehung:

Selektor {Eigenschaftenname: B! wichtig; Eigenschaftenname: A}

(4) besteht ein Bedarf an gewissen Abstand zwischen einer Reihe von Tags verschachtelt werden, überlassen Sie es der Margin-Eigenschaft des Labels im Inneren, anstatt definieren die Marke, die ist befindet sich außen Polsterung
(5) das Symbol vor dem Li-Etikett wird empfohlen, anstelle von List-Style-Image-Hintergrundbild verwenden.
(6) IE kann nicht sagen, den Unterschied zwischen Vererbungsbeziehung und Eltern-Kind-Beziehung, die Vererbungsbeziehungen sind.
(7) bei Ihrem Label verrückt plus einen Selektor geben, vergessen Sie nicht, den Selektor in CSS zu kommentieren.

Wenn Sie später Ihr CSS ändern, wissen Sie, warum Sie es tun.
8, wenn Sie ein Etikett geben stellen Sie einen dunklen Ton des Hintergrundbildes und hellen Ton von den Texteffekt.

Es wird empfohlen, Ihr Label zu diesem Zeitpunkt geben und dann eine dunklen Ton Hintergrundfarbe festlegen.
9, definieren die vier Zustände des Links auf die Reihenfolge achten:

Link Visited Hover Active

10, der Inhalt bezieht sich nicht auf das Bild bitte verwenden Sie Hintergrund
Eins nach dem anderen die Definition Farbe kann abgekürzt #8899ff = #89F
12, Tabelle in gewisser Weise als andere Etiketten-Performance ist viel besser. Bitte verwenden Sie es, wo die Spaltenausrichtung erforderlich ist.
13, muss die Sprache nicht diese Eigenschaft

Sollte wie folgt geschrieben werden:

<script type=”text/JavaScript”>

14. der Titel ist der Titel und der Text des Titels ist der Text des Titels.

Manchmal der Titel muss nicht unbedingt zur Anzeige von Text, so dass die: < h1 > Titel Inhalt wird geändert, um den Inhalt der
15, der perfekte Tan Shansu Frame Line Tisch (in IE5, IE6, IE7 und FF1.0.4 oben kann den Test bestehen)

table{border-collapse:collapse;}td{border:#000 solid 1px;}

16, kann negative Margin-Wert die Rolle des relative Positionierung, wenn das Label absolute Positionierung verwendet

Wenn die Seite zentriert ist, ist die Schicht, die absolute Positionierung verwendet nicht geeignet für die Verwendung der Links: XXpx-Eigenschaft. Es ist ein guter Weg, um diese Schicht neben einer Beschriftung setzen, die Sie möchten relativ zu positionieren, und verwenden Sie dann den negativen Wert des Rands.
17, absolute Positionierung, wenn die Verwendung von Marge Wert Positionierung um die eigene Position kann, anders als oben verglichen werden, links und andere Eigenschaften als die Fenster-Rand-Positionierung. Der Vorteil der absoluten Positionierung ist, dass es andere Elemente um seine Existenz zu ignorieren.

18, wenn der Text zu lang ist, dann der lange Teil in eine Ellipse Anzeige: IE5, FF ungültig, kann jedoch ausgeblendet, IE6 wirksam

≪ P STYLE = "Höhe: 50px; Border: 1px solid blau, Breite: 120px; Overflow: versteckt; Text-Overflow: Ellipsis" >< NOBR Die. < / NOBR > ist, z. B. eine Textzeile, sehr lang, eine Zeile in der Tabelle wird nicht angezeigt

19, in Internet Explorer möglicherweise aufgrund von Kommentaren verursacht durch Text-Wiederholung, die Probleme in geändert werden können:

<!–[if !IE]>Put your commentary in here…<![endif]–>

20. wie externe Fonts mit CSS aufrufen
Grammatik:

@font-face{font-family:name;src:url(url);sRules}

Nehmen Sie Wert:
Name: Name der Schriftart. Der Wert von jedem möglich Font-Family-Eigenschaft
URL (URL): OpenType-Font-Datei mit absoluten oder relativen URL-Adresse angeben
SRules: Style-Sheet-definition
21. wie mache ich den Text in einem Textfeld in einem Formular-Center vertikal?
Wenn die Gruppe mit Zeilenhöhe und Höhe ist nicht wirksam bei der FF, der Weg ist, definieren Sie die obere und untere Weißfärbung kann die Wirkung des Denkens zu erreichen.
22, definieren Sie ein Label auf das kleine Problem zu achten:
Wenn wir definieren eine {Color: Red;} , Es repräsentiert den Stil eines der vier Staaten, und wenn Sie eine Maus über den Stand zu diesem Zeitpunkt definieren möchten, definieren Sie einfach ein: Hover und die anderen drei Staaten sind die Stile in A. definiert
Wenn Sie nur eine definieren ein: link, achten Sie darauf, denken Sie daran, die anderen drei Staaten definieren!
23. nicht alle Formatvorlagen sollten abgekürzt werden:
Wenn das Stylesheet vor p {Padding: 1px 2px 3px 4px} definiert ist, wird das nachfolgende Projekt 5px unter 6px Bleaching Zahnaufhellung ein Stil hinzugefügt. Wir haben nicht p.style1{padding:5px 6px 3px 4px schreiben}. Kann als ein style1 geschrieben werden {padding-Top: 5px; Padding-rechts: 6px;}, Sie können das Gefühl, dass es nicht so gut wie früher, aber Sie glaube nicht, dass Ihr Schreiben wiederholt den Stil definiert Darüber hinaus kann man nicht, das Original nach dem Bleaching zu finden und links Bleaching-Wert ist, wie viel! Wenn die bisherige Stil P später ändert, ändert sich auch der Stil der style1, die Sie definieren.
24, desto größer die Website, die weitere CSS-Stile, bevor Sie beginnen, bitte einen guten Job der Vorbereitung und Planung, tun, einschließlich der Benennung zu Regeln. Seite Block Division, internen Style Klassifizierung und so weiter.
25, ein paar häufig verwendete CSS-Stile:
(1) richten Sie beide Enden des chinesischen Textes:

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

(2) feste Breite chinesische Schriftzeichen abschneiden:

overflow:hidden;text-overflow:ellipsis;white-space:nowrap;

(Aber Sie verträgt nur Abschneiden der Text in einer Zeile und nicht verarbeiten kann mehrere Zeilen.) ) (IE5 oben) FF nicht, es wird nur ausgeblendet.
(3) feste Breite chinesische Zeichen (Wort) Falzlinie:

table-layout:fixed; word-break:break-all;

(IE5 oben) FF nicht möglich.
(4) < Abkürzung Titel = "Geben Sie den Text Sie auffordern möchten" Style = "CURSOR: HELP;" _ _ Text wird mit der Maus auf den vorderen Text verwendet, um den Effekt zu sehen. Diesen Effekt kann man in vielen Websites im Ausland, und es gibt wenige und nur wenige im Land.
(5) das Bild wird transparent festgelegt:

.halfalpha { background-color:#000000;filter:Alpha(Opacity=50)}

Im IE6 und IE5 Test bestanden FF nicht bestanden, deshalb, weil dieser Stil ist IE private Dinge;
(6) Flash Transparent:

Wählen Sie die SWF-Datei, der ursprüngliche Code-Fenster zu öffnen, und geben Sie < Param Name = "Wmode" Value = "Transparent" oberhalb der _ _ _ _ den Code für den Internet Explorer.
Eine ähnliche Parameter Wmode = "Transparent" wurde hinzugefügt, um die Seitenbezeichnung für FIREFOX
(7) auf diese Weise Web-Seiten häufig verwenden, setzen Sie die Maus auf das Bild erscheint, um die Wirkung des Bildes zu erhellen, können Sie das Bild durch die Technik ersetzen, können Sie auch den folgenden Filter:

.pictures img {filter: alpha(opacity=45); }.pictures a:hover img {filter: alpha(opacity=90); }