Tip:
Highlight text to annotate it
X
>> SPRECHER: Also, es ist eigentlich nicht die beste entwerfen, um CSS mit HTML vermischen.
Vielmehr ist es am besten zu Faktor Ihre CSS, legte es irgendwo zentral, und
irgendwie auf das anwenden -Tags in Ihre Web-Seite.
Um dies zu erreichen, können wir tatsächlich stoppen mit dem Stil-Attribut und statt
verwenden einen Style-Tag, der in die gehört Kopf einer Webseite neben, für
Beispiel Ihr Titel.
>> Geben wir diese ausprobieren und neu implementieren eine Homepage für John Harvard
mit dem Stil-Tags.
Ich habe schon begonnen uns hier mit drei divs für
Homepage John Harvard.
Aber lassen Sie uns zuerst gehen jetzt bis zu dieser ersten div, und fügen Sie ein neues Attribut,
nämlich ID und festlegen, dass eine einzigartige Bezeichner für diese besondere div
sind, zum Beispiel, Zitat unquote "Oben", ein beliebiger Name, aber
beschreibend, dass dieses div ist tatsächlich an der Spitze meiner Seite.
>> Für die nächste div, versuchen wir es ein verschiedene ID-Zitat unquote
"Mitte", und geben wir den dritten div eine ID-Zitat unquote "unten." Wir
Jetzt haben drei eindeutige Kennung zu dem wir einige CSS gelten
Eigenschaften, aber zunächst wollen wir Rück zum Kopf der Seite.
Knapp oberhalb der Titel hier, werde ich gehen Sie vor und definieren Stil
und schließen Sie dann Stil.
>> Innerhalb dieses jetzt, ich werde definieren Einige CSS-Eigenschaften, nämlich die
gleichen, die ich vorher in der Art hatte Attribute, aber hier werden sie sein
zentral definiert.
Um dies zu tun, ich werde das Pfund angeben Symbol, gefolgt von oben, wodurch
die Angabe, dass das folgende CSS Eigenschaften sollten, was auch immer gelten
HTML-Element verfügt über die einzigartige Kennung der Spitze.
Ich bin dann werde einige geöffnet haben und geschlossenen geschweiften Klammern, und ich bin zu gehen
angeben, sagen wir, die Schriftgröße beträgt 36 sein Pixel, Schriftschnitt sind fett.
>> Um die Dinge sauber zu halten, setze ich jedes diese Eigenschaften nun auf eigene
Linie, aber das ist nur eine stilistischen Konvention.
Darunter wollen wir definieren nun eine weitere Wahl, so zu sprechen.
Das eine für den HTML-Tag, hat eindeutige Kennung der Mitte.
Und hier, lassen Sie uns geben Sie eine Schriftgröße von 24 Pixel, unter diesem ein weiterer
Wahl für unten und innen dass, wir geben ein
Schriftgröße von 12 Pixeln.
>> Lassen Sie uns jetzt noch retten, ändern Sie die Berechtigungen auf, und laden Sie diese Seite in einem Browser,
chmod ein Plus r css-1.html.
Wir öffnen bis Chrome und besuchen http://localhost/css-1.html.
Nicht schlecht.
Genau so, wie ich wollte, aber ich würde gerne nehmen die Dinge einen Schritt weiter und jetzt
Center John Harvard Text.
Nun, dies zu tun, ich könnte das wickeln ganze Seite in einem div, als ich
hat einen früheren Beispiel.
Oder ich kann klüger sein und erkennen, dass alle diese divs sind innerhalb von
Körper meiner Seite, warum soll nicht nur gelten eine oder mehrere CSS-Eigenschaften auf den Körper
Tag selbst?
>> Um dies zu tun, wollen wir tun.
Gehen wir zurück zu gedit Sie hier.
Lassen Sie uns zurückblättern bis zu den Style-Tag, und lassen Sie uns geben Sie einen Wahl nur
mit diesem Tag den Namen, die Körper.
Darunter lassen wir unsere geschweiften Klammern gefolgt von text-align-Center.
Lassen Sie uns nun die Seite speichern und laden es innerhalb dieser Browser.
Seite neu laden in Chrome, und voila.
Wir haben jetzt John Harvard-Seite zentriert, als wir gedacht.