1
00:00:00,000 --> 00:00:00,290

2
00:00:00,290 --> 00:00:03,310
>> Ræðumaður: Það kemur í ljós að HTML er ekki
eina tungumálið sem þú getur notað innan

3
00:00:03,310 --> 00:00:03,895
af a vefur blaðsíða.

4
00:00:03,895 --> 00:00:08,100
Þú getur notað eitthvað sem kallast CSS, eða
Cascading Style Sheets, eins og heilbrigður.

5
00:00:08,100 --> 00:00:12,120
CSS leyfa þér að tilgreina miklu meira
einmitt fagurfræði vefnum

6
00:00:12,120 --> 00:00:16,930
síðu, þar með talið skipulag og stærðum og
liti og letur og margt fleira.

7
00:00:16,930 --> 00:00:20,820
Fyrir dæmi, við skulum búa til vefsíðu
hér kallað CSS0 sem táknar

8
00:00:20,820 --> 00:00:22,740
heimasíða fyrir, segja, John Harvard.

9
00:00:22,740 --> 00:00:25,480
>> Á þessari síðu munum við hafa John Harvard
nafn, undir sem verður

10
00:00:25,480 --> 00:00:28,500
ágætur skilaboð fyrir gesti sína, undir
sem verður fæti, með

11
00:00:28,500 --> 00:00:30,590
segja, sumu upplýsingar.

12
00:00:30,590 --> 00:00:34,650
Til að gera þetta, við skulum skilgreina þrískiptan
fyrir síðuna með því að nota merki

13
00:00:34,650 --> 00:00:35,670
kallað div.

14
00:00:35,670 --> 00:00:43,880
Open krappi div, John Harvard, nálægt
krappi div, annar opinn krappi div,

15
00:00:43,880 --> 00:00:48,330
og nú munum tilgreina eitthvað
eins, velkomin á heimasíðuna mína!

16
00:00:48,330 --> 00:00:50,420
Og við skulum loka þessum DIV, eins og heilbrigður.

17
00:00:50,420 --> 00:00:53,700
>> Og nú í þriðja og síðasta
div, höfundarrétt.

18
00:00:53,700 --> 00:00:58,250
Bara að vera ímynda sér, láta mig nota nú til HTML
aðila, tákn sem sýnir

19
00:00:58,250 --> 00:01:01,140
A karakter sem þú gætir ekki annað
skrifar á lyklaborðinu þínu.

20
00:01:01,140 --> 00:01:07,490
Einkum ætla ég að gera
merkið, pund, 169, semíkommu.

21
00:01:07,490 --> 00:01:10,620
Kemur í ljós að er tölustafir númer
fyrir höfundarrétti tákn.

22
00:01:10,620 --> 00:01:14,260
Þá skulum tilgreina John Harvard
hér neðst.

23
00:01:14,260 --> 00:01:17,180
Skulum loka div og vista skrána.

24
00:01:17,180 --> 00:01:18,910
>> Nú, hvað er þetta div tag?

25
00:01:18,910 --> 00:01:21,970
The div tag skilgreinir einfaldlega deild
á síðunni, sem er fyrst og fremst á

26
00:01:21,970 --> 00:01:23,310
rétthyrnd svæði.

27
00:01:23,310 --> 00:01:26,850
Svo á þessari stundu í tíma, hef ég þrjá
rétthyrnd svæði, einn á toppnum

28
00:01:26,850 --> 00:01:27,620
hins.

29
00:01:27,620 --> 00:01:30,610
Þannig að nú er nánast orðin eins og
þótt ég hefði þrjár málsgreinar.

30
00:01:30,610 --> 00:01:33,490
En við munum ekki sjá alveg eins mikið
hvítt pláss á milli þeirra.

31
00:01:33,490 --> 00:01:36,170
>> Skulum vista þessa skrá, breytt fjár
heimildir, og taka a líta á að

32
00:01:36,170 --> 00:01:37,990
augnablik í Chrome.

33
00:01:37,990 --> 00:01:43,040
Chmod A + r CSS0.html.

34
00:01:43,040 --> 00:01:52,440
Við skulum nú opna Króm og heimsókn
http://localhost.CSS0.html.

35
00:01:52,440 --> 00:01:54,630
Reyndar, hér er heimasíða
John Harvard.

36
00:01:54,630 --> 00:01:59,370
Skulum nú stylize það svolítið meira
einmitt með einhverja CSS.

37
00:01:59,370 --> 00:02:03,510
>> Aftur í gedit, við skulum fara inn í þessa
Fyrsta div tag og bæta við stíl

38
00:02:03,510 --> 00:02:11,060
eigindi tilgreina að ég vil
Leturstærð, segjum 36 dílar, eða px.

39
00:02:11,060 --> 00:02:15,650
Og ég vil vægi þessa leturgerð
að vera djörf fremur en sjálfgefið,

40
00:02:15,650 --> 00:02:16,980
sem er eðlilegt.

41
00:02:16,980 --> 00:02:21,170
Fyrir seinni div, við skulum skilgreina
annar stíll eiginleiki sem hefur

42
00:02:21,170 --> 00:02:25,550
Leturstærð 24 punktar, svo
svolítið minni.

43
00:02:25,550 --> 00:02:28,410
Loka vitna eftir semíkommu.

44
00:02:28,410 --> 00:02:33,255
>> Loksins, í þessu þriðja div, við skulum gera
stíl jafngildir quote, leturstærð, og

45
00:02:33,255 --> 00:02:35,340
segjum 12 punktar í þetta skipti.

46
00:02:35,340 --> 00:02:37,280
Loka vitna eftir semíkommu.

47
00:02:37,280 --> 00:02:40,200
Takið þá að ég virðist hafa
tilgreint hluti af stylization fyrir

48
00:02:40,200 --> 00:02:43,770
hver af þessum þremur divs að nota,
það kemur í ljós, CSS.

49
00:02:43,770 --> 00:02:47,820
Í staðreynd, the setningafræði sem þú sérð í
milli þeirra gæsalappa er CSS,

50
00:02:47,820 --> 00:02:50,620
sérstaklega CSS eignir
með gildi.

51
00:02:50,620 --> 00:02:53,910
Og eftir að fyrsta merkinu, þar sem ég hafði
tvö slík eiginleika, leturstærð og

52
00:02:53,910 --> 00:02:57,290
letur þyngd, ég greindi einfaldlega
þau með semíkommu.

53
00:02:57,290 --> 00:02:59,940
>> Nú, bara fyrir sakir Style, ég
Einnig innifalinn semikommum á

54
00:02:59,940 --> 00:03:00,880
í lok hverrar línu.

55
00:03:00,880 --> 00:03:04,270
En þeir eru ekki brýna nauðsyn,
sérstaklega þegar þú hefur aðeins einn

56
00:03:04,270 --> 00:03:05,580
eign skilgreind.

57
00:03:05,580 --> 00:03:08,370
Skulum nú vista skrána og endurhlaða
í Króm, og sjá hvað

58
00:03:08,370 --> 00:03:11,000
Nettó áhrif er.

59
00:03:11,000 --> 00:03:13,470
Til baka í Króm hér,
skulum smella á Reload.

60
00:03:13,470 --> 00:03:15,800
>> Nú höfum við örlítið meira áhugavert
heimasíða fyrir John

61
00:03:15,800 --> 00:03:19,000
Harvard, þar sem fyrsta lína með
nafn hans, sem er inni í því

62
00:03:19,000 --> 00:03:23,470
Fyrsta div, er 36 punktar á hæð og einnig
Feitletrun, þar sem annarri línu,

63
00:03:23,470 --> 00:03:27,340
sem er í þeirri seinni div, er 24
pixlar á hæð, en ekki feitletra.

64
00:03:27,340 --> 00:03:31,500
Og þar sem þriðja línan í því þriðja
div er 12 punktar á hæð og einnig

65
00:03:31,500 --> 00:03:32,610
ekki feitletra.

66
00:03:32,610 --> 00:03:35,380
En geri ráð fyrir nú langar mig að skipta
allan texta yfir

67
00:03:35,380 --> 00:03:36,650
þannig að það er fyrir miðju.

68
00:03:36,650 --> 00:03:40,480
>> Ég gæti samræma hverja einstaka
divs eins og að vera með miðju.

69
00:03:40,480 --> 00:03:45,330
En fleiri auðveldlega, gæti ég sett þá
þrjú divs inni í fjórða div, a

70
00:03:45,330 --> 00:03:49,360
foreldri div, svo að segja, og tilgreina
að þessi div og allar hennar

71
00:03:49,360 --> 00:03:52,610
afkomendur ættu að vera
texti takt sent?

72
00:03:52,610 --> 00:03:54,120
Skulum taka a útlit.

73
00:03:54,120 --> 00:03:58,510
>> Inni í gedit, við skulum fara aftur til mín
líkami og bæta við nýjum div upp efst með

74
00:03:58,510 --> 00:04:04,460
div, stíll jafngildir vitna unquote
texti align Center, nálægt

75
00:04:04,460 --> 00:04:06,250
vitna eftir semíkommu.

76
00:04:06,250 --> 00:04:10,280
Og nú, við skulum fara á undan og undirliður allt
af þessum línum sem við slegið áður.

77
00:04:10,280 --> 00:04:15,040
Og undir því þriðja div, við skulum
loka þessa nýju DIV.

78
00:04:15,040 --> 00:04:18,829
>> Með öðrum orðum, vegna þess að þeir þrír
upprunalega divs eru nú börn, svo að

79
00:04:18,829 --> 00:04:22,110
tala, nýs foreldri div og ég hef
tilgreint sem mig langar til að samræma

80
00:04:22,110 --> 00:04:26,140
texti foreldrisins div í miðju
á síðunni, að eign verður

81
00:04:26,140 --> 00:04:28,290
erfist öllum þeim börnum.

82
00:04:28,290 --> 00:04:32,370
Reyndar, við skulum vista skrána og
kíkja í vafranum.

83
00:04:32,370 --> 00:04:34,650
Skulum endurhlaða í Króm.

84
00:04:34,650 --> 00:04:37,540
Og þar höfum við það, enn betur
heimasíða fyrir John Harvard.

85
00:04:37,540 --> 00:04:39,872