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

2
00:00:00,290 --> 00:00:03,310
>> SPEAKER: Rezultas, ke HTML ne estas
la sola lingvo povas uzi interne

3
00:00:03,310 --> 00:00:03,895
de retpaĝo.

4
00:00:03,895 --> 00:00:08,100
Vi povas uzi iun nomita CSS, aŭ
Kaskadan Style Sheets, tiel.

5
00:00:08,100 --> 00:00:12,120
CSS permesas precizigi multe pli
precize la estetiko de la retejo

6
00:00:12,120 --> 00:00:16,930
paĝo, inkludante aranĝo kaj grandecoj kaj
koloroj kaj tiparoj kaj multe pli.

7
00:00:16,930 --> 00:00:20,820
Ekzemple, ni kreos retpaĝon
tie nomata CSS0 kiuj reprezentas

8
00:00:20,820 --> 00:00:22,740
hejmpaĝo por, ni diru, John Harvard.

9
00:00:22,740 --> 00:00:25,480
>> Sur ĉi tiu paĝo, ni devos John Harvard
enoficigi, sub kiuj estos

10
00:00:25,480 --> 00:00:28,500
agrabla mesaĝo por siaj vizitantoj, malsupre de
kiu estos piedlinio, kun

11
00:00:28,500 --> 00:00:30,590
diri, kelkaj kopirajta informo.

12
00:00:30,590 --> 00:00:34,650
Por fari tion, ni difini tri dividoj
cxar la paĝon uzante etikedon

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

14
00:00:35,670 --> 00:00:43,880
Malferma krampo div, John Harvard, fermo
krampo div, alia malferma krampo div,

15
00:00:43,880 --> 00:00:48,330
kaj nun ni devos specifi ion
kiel, bonvenon al mia hejmpaĝo!

16
00:00:48,330 --> 00:00:50,420
Kaj ni fermu div, tiel.

17
00:00:50,420 --> 00:00:53,700
>> Kaj nun la tria kaj fina
div aŭtorrajtoj.

18
00:00:53,700 --> 00:00:58,250
Nur esti imago, permesu al mi uzi nun HTML
ento, simbolo kiu reprezentas

19
00:00:58,250 --> 00:01:01,140
karaktero, ke vi ne povis alie
tajpi sur via klavaro.

20
00:01:01,140 --> 00:01:07,490
Specife, mi iras fari
ampersand, funto, 169, punktokomo.

21
00:01:07,490 --> 00:01:10,620
Rezultas, ke estas la nombra kodo
cxar la kopirajta simbolo.

22
00:01:10,620 --> 00:01:14,260
Do ni specifi John Harvard
tie ĉe la malsupro.

23
00:01:14,260 --> 00:01:17,180
Ni fermas la div kaj savu la dosieron.

24
00:01:17,180 --> 00:01:18,910
>> Nun, kio estas ĉi div etikedon?

25
00:01:18,910 --> 00:01:21,970
La div tag simple difinas divido
de la paĝo, kiu estas esence

26
00:01:21,970 --> 00:01:23,310
rektangula regiono.

27
00:01:23,310 --> 00:01:26,850
Do, je tiu momento en tempo, mi havas tri
rektangula regionoj, unu sur supro

28
00:01:26,850 --> 00:01:27,620
de la alia.

29
00:01:27,620 --> 00:01:30,610
Do nuntempe, la efiko estas preskaŭ tiel
kvankam mi havis tri alineojn.

30
00:01:30,610 --> 00:01:33,490
Sed ni ne volas vidi tiom multe
blanka spaco inter ili.

31
00:01:33,490 --> 00:01:36,170
>> Ni savu tiu dosiero, ŝanĝi sian
permesojn, kaj prenu serĉi

32
00:01:36,170 --> 00:01:37,990
momento en Chrome.

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

34
00:01:43,040 --> 00:01:52,440
Ni nun malfermi Chrome kaj vizito
http://localhost.CSS0.html.

35
00:01:52,440 --> 00:01:54,630
Ja, jen hejmpaĝo
John Harvard.

36
00:01:54,630 --> 00:01:59,370
Ni nun stylize ĝin iom pli
ĝuste uzante kelkaj CSS.

37
00:01:59,370 --> 00:02:03,510
>> Reen en gedit, ni iros al tiu
unua div etikedon kaj aldonu stilon

38
00:02:03,510 --> 00:02:11,060
atribui specifante kiujn mi ŝatus
tiparo de, ekzemple, 36 rastrumeroj, aŭ px.

39
00:02:11,060 --> 00:02:15,650
Kaj mi ŝatus la pezon de tiu tiparo
kuragxi anstataŭ la defaŭlta,

40
00:02:15,650 --> 00:02:16,980
kio estas normala.

41
00:02:16,980 --> 00:02:21,170
Por la dua div, ni specifi
alia stilo atributo kiu havas

42
00:02:21,170 --> 00:02:25,550
tiparo grandeco de 24 rastrumeroj, tiel
iomete pli malgranda.

43
00:02:25,550 --> 00:02:28,410
Fermu citiloj post la punktokomo.

44
00:02:28,410 --> 00:02:33,255
>> Fine, en ĉi tiu tria div, ni faru
stilo egalas citaĵo, tiparo, kaj

45
00:02:33,255 --> 00:02:35,340
diru 12 rastrumeroj tiu tempo.

46
00:02:35,340 --> 00:02:37,280
Fermu citaĵo post la punktokomo.

47
00:02:37,280 --> 00:02:40,200
Rimarku do, ke mi ŝajnis havi
specifita iom de estilización por

48
00:02:40,200 --> 00:02:43,770
ĉiu el tiuj tri divs uzanta,
rezultas, CSS.

49
00:02:43,770 --> 00:02:47,820
Fakte, la sintakson, kiun vi vidas en
inter tiuj citiloj estas CSS,

50
00:02:47,820 --> 00:02:50,620
specife CSS propraĵoj
per valoroj.

51
00:02:50,620 --> 00:02:53,910
Kaj por tiu unua etikedo, kie mi havis
du tiaj propraĵoj, tiparo kaj

52
00:02:53,910 --> 00:02:57,290
tiparo pezo, mi simple apartigis
ilin per punktokomo.

53
00:02:57,290 --> 00:02:59,940
>> Nun, simple por stilo, kalkaj, mi
ankaŭ inkludita punktokomojn ĉe

54
00:02:59,940 --> 00:03:00,880
la fino de ĉiu linio.

55
00:03:00,880 --> 00:03:04,270
Sed ili ne estas rigore necesa,
aparte kiam vi havas nur unu

56
00:03:04,270 --> 00:03:05,580
propraĵo difinita.

57
00:03:05,580 --> 00:03:08,370
Ni nun savu la dosieron kaj reŝarĝi
en Chrome, kaj vidi kion

58
00:03:08,370 --> 00:03:11,000
la pura efekto estas.

59
00:03:11,000 --> 00:03:13,470
Reen en Chrome ĉi tie,
ni klaku Reŝarĝi.

60
00:03:13,470 --> 00:03:15,800
>> Nun ni havas iomete pli interesa
hejmpaĝo por John

61
00:03:15,800 --> 00:03:19,000
Harvard, per kiu la unuan linion kun
lia nomo, kiu estas interne de tiu

62
00:03:19,000 --> 00:03:23,470
unua div, estas 36 rastrumeroj grandkreska kaj ankaŭ
grasa tiparfasono, per la dua linio,

63
00:03:23,470 --> 00:03:27,340
kio estas en tiu dua div, estas 24
rastrumeroj alta, sed ne grasa tiparfasono.

64
00:03:27,340 --> 00:03:31,500
Kaj per la tria linio en tiu tria
div estas 12 rastrumeroj grandkreska kaj same

65
00:03:31,500 --> 00:03:32,610
Ne grasa tiparfasono.

66
00:03:32,610 --> 00:03:35,380
Sed supozu nun mi ŝatus ŝanĝi
ĉio ĉi teksto super

67
00:03:35,380 --> 00:03:36,650
tia, ke ĝi estas centrita.

68
00:03:36,650 --> 00:03:40,480
>> Mi povus vicigi ĉiu de la individuo
divs kiel esti centrita.

69
00:03:40,480 --> 00:03:45,330
Sed pli facile, mi povus kovri tiujn
tri divs ene de kvara div, a

70
00:03:45,330 --> 00:03:49,360
patro div, por tiel diri, kaj specifi
ke tio div kaj ĉiuj ties

71
00:03:49,360 --> 00:03:52,610
posteuloj estu
teksto vicigitaj centro?

72
00:03:52,610 --> 00:03:54,120
Ni rigardu.

73
00:03:54,120 --> 00:03:58,510
>> Interne de gedit, ni reiru al mia
korpo kaj aldoni novajn div supren supro kun

74
00:03:58,510 --> 00:04:04,460
div, stilo egalas citaĵo unquote
teksto align centro, proksime

75
00:04:04,460 --> 00:04:06,250
quote post la punktokomo.

76
00:04:06,250 --> 00:04:10,280
Kaj nun, ni iru antaŭen kaj indent ĉiuj
de tiuj linioj kiuj ni tajpis antaŭe.

77
00:04:10,280 --> 00:04:15,040
Kaj sub tiu tria div, ni
fermi tiun novan div.

78
00:04:15,040 --> 00:04:18,829
>> En aliaj vortoj, ĉar tiuj tri
originalaj divs nun estas infanoj, tiel

79
00:04:18,829 --> 00:04:22,110
paroli, de nova patro div kaj mi
specifis ke mi ŝatus vicigi la

80
00:04:22,110 --> 00:04:26,140
teksto de tiu patro div en la centro
de la paĝo, por ke posedaĵo estos

81
00:04:26,140 --> 00:04:28,290
heredita de ĉiuj el tiuj infanoj.

82
00:04:28,290 --> 00:04:32,370
Ja, ni savu la dosieron kaj
rigardu en retumilo.

83
00:04:32,370 --> 00:04:34,650
Ni freŝigi en Chrome.

84
00:04:34,650 --> 00:04:37,540
Kaj tie ni havas ĝin, eĉ pli agrabla
hejmpaĝo por John Harvard.

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