1
00:00:00,000 --> 00:00:00,300

2
00:00:00,300 --> 00:00:04,840
>> SPRECHER: Also, es ist eigentlich nicht die beste
entwerfen, um CSS mit HTML vermischen.

3
00:00:04,840 --> 00:00:08,700
Vielmehr ist es am besten zu Faktor Ihre
CSS, legte es irgendwo zentral, und

4
00:00:08,700 --> 00:00:11,430
irgendwie auf das anwenden
-Tags in Ihre Web-Seite.

5
00:00:11,430 --> 00:00:15,290
Um dies zu erreichen, können wir tatsächlich stoppen
mit dem Stil-Attribut und statt

6
00:00:15,290 --> 00:00:19,290
verwenden einen Style-Tag, der in die gehört
Kopf einer Webseite neben, für

7
00:00:19,290 --> 00:00:20,700
Beispiel Ihr Titel.

8
00:00:20,700 --> 00:00:24,400
>> Geben wir diese ausprobieren und neu implementieren
eine Homepage für John Harvard

9
00:00:24,400 --> 00:00:26,410
mit dem Stil-Tags.

10
00:00:26,410 --> 00:00:28,930
Ich habe schon begonnen uns
hier mit drei divs für

11
00:00:28,930 --> 00:00:30,260
Homepage John Harvard.

12
00:00:30,260 --> 00:00:33,990
Aber lassen Sie uns zuerst gehen jetzt bis zu dieser ersten
div, und fügen Sie ein neues Attribut,

13
00:00:33,990 --> 00:00:38,680
nämlich ID und festlegen, dass eine einzigartige
Bezeichner für diese besondere div

14
00:00:38,680 --> 00:00:42,390
sind, zum Beispiel, Zitat unquote
"Oben", ein beliebiger Name, aber

15
00:00:42,390 --> 00:00:45,840
beschreibend, dass dieses div ist
tatsächlich an der Spitze meiner Seite.

16
00:00:45,840 --> 00:00:48,920
>> Für die nächste div, versuchen wir es ein
verschiedene ID-Zitat unquote

17
00:00:48,920 --> 00:00:54,080
"Mitte", und geben wir den dritten div
eine ID-Zitat unquote "unten." Wir

18
00:00:54,080 --> 00:00:57,740
Jetzt haben drei eindeutige Kennung
zu dem wir einige CSS gelten

19
00:00:57,740 --> 00:01:01,210
Eigenschaften, aber zunächst wollen wir Rück
zum Kopf der Seite.

20
00:01:01,210 --> 00:01:04,760
Knapp oberhalb der Titel hier, werde ich
gehen Sie vor und definieren Stil

21
00:01:04,760 --> 00:01:07,120
und schließen Sie dann Stil.

22
00:01:07,120 --> 00:01:10,340
>> Innerhalb dieses jetzt, ich werde definieren
Einige CSS-Eigenschaften, nämlich die

23
00:01:10,340 --> 00:01:14,550
gleichen, die ich vorher in der Art hatte
Attribute, aber hier werden sie sein

24
00:01:14,550 --> 00:01:16,320
zentral definiert.

25
00:01:16,320 --> 00:01:20,880
Um dies zu tun, ich werde das Pfund angeben
Symbol, gefolgt von oben, wodurch

26
00:01:20,880 --> 00:01:24,710
die Angabe, dass das folgende CSS
Eigenschaften sollten, was auch immer gelten

27
00:01:24,710 --> 00:01:28,800
HTML-Element verfügt über die einzigartige
Kennung der Spitze.

28
00:01:28,800 --> 00:01:32,240
Ich bin dann werde einige geöffnet haben und
geschlossenen geschweiften Klammern, und ich bin zu gehen

29
00:01:32,240 --> 00:01:39,170
angeben, sagen wir, die Schriftgröße beträgt 36 sein
Pixel, Schriftschnitt sind fett.

30
00:01:39,170 --> 00:01:41,810
>> Um die Dinge sauber zu halten, setze ich jedes
diese Eigenschaften nun auf eigene

31
00:01:41,810 --> 00:01:44,610
Linie, aber das ist nur eine
stilistischen Konvention.

32
00:01:44,610 --> 00:01:47,830
Darunter wollen wir definieren nun eine weitere
Wahl, so zu sprechen.

33
00:01:47,830 --> 00:01:52,680
Das eine für den HTML-Tag, hat
eindeutige Kennung der Mitte.

34
00:01:52,680 --> 00:01:57,540
Und hier, lassen Sie uns geben Sie eine Schriftgröße
von 24 Pixel, unter diesem ein weiterer

35
00:01:57,540 --> 00:02:01,520
Wahl für unten und innen
dass, wir geben ein

36
00:02:01,520 --> 00:02:03,850
Schriftgröße von 12 Pixeln.

37
00:02:03,850 --> 00:02:09,350
>> Lassen Sie uns jetzt noch retten, ändern Sie die Berechtigungen
auf, und laden Sie diese Seite in einem Browser,

38
00:02:09,350 --> 00:02:14,230
chmod ein Plus r css-1.html.

39
00:02:14,230 --> 00:02:22,260
Wir öffnen bis Chrome und besuchen
http://localhost/css-1.html.

40
00:02:22,260 --> 00:02:22,960
Nicht schlecht.

41
00:02:22,960 --> 00:02:26,930
Genau so, wie ich wollte, aber ich würde gerne
nehmen die Dinge einen Schritt weiter und jetzt

42
00:02:26,930 --> 00:02:29,050
Center John Harvard Text.

43
00:02:29,050 --> 00:02:32,080
Nun, dies zu tun, ich könnte das wickeln
ganze Seite in einem div, als ich

44
00:02:32,080 --> 00:02:33,800
hat einen früheren Beispiel.

45
00:02:33,800 --> 00:02:37,820
Oder ich kann klüger sein und erkennen, dass
alle diese divs sind innerhalb von

46
00:02:37,820 --> 00:02:42,420
Körper meiner Seite, warum soll nicht nur gelten
eine oder mehrere CSS-Eigenschaften auf den Körper

47
00:02:42,420 --> 00:02:43,850
Tag selbst?

48
00:02:43,850 --> 00:02:45,460
>> Um dies zu tun, wollen wir tun.

49
00:02:45,460 --> 00:02:47,650
Gehen wir zurück zu gedit Sie hier.

50
00:02:47,650 --> 00:02:52,460
Lassen Sie uns zurückblättern bis zu den Style-Tag,
und lassen Sie uns geben Sie einen Wahl nur

51
00:02:52,460 --> 00:02:54,520
mit diesem Tag den Namen, die Körper.

52
00:02:54,520 --> 00:03:00,580
Darunter lassen wir unsere geschweiften Klammern
gefolgt von text-align-Center.

53
00:03:00,580 --> 00:03:05,580
Lassen Sie uns nun die Seite speichern und laden
es innerhalb dieser Browser.

54
00:03:05,580 --> 00:03:08,090
Seite neu laden in Chrome, und voila.

55
00:03:08,090 --> 00:03:11,000
Wir haben jetzt John Harvard-Seite
zentriert, als wir gedacht.

56
00:03:11,000 --> 00:03:12,619