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

2
00:00:00,290 --> 00:00:03,310
>> SPEAKER: Kiderül, hogy a HTML nem
az egyetlen nyelv, akkor a benne

3
00:00:03,310 --> 00:00:03,895
Egy weboldal.

4
00:00:03,895 --> 00:00:08,100
Használhatja úgynevezett CSS vagy
Cascading Style Sheets, valamint.

5
00:00:08,100 --> 00:00:12,120
CSS lehetővé teszi, hogy meghatározza sokkal
pontosan az esztétika a web

6
00:00:12,120 --> 00:00:16,930
oldal, beleértve az elrendezés és méretű
színek és betűtípusok és még sok más.

7
00:00:16,930 --> 00:00:20,820
Például hozzunk létre egy weboldalt
Itt az úgynevezett CSS0, ami egy

8
00:00:20,820 --> 00:00:22,740
kezdőlapját, mondjuk, John Harvard.

9
00:00:22,740 --> 00:00:25,480
>> Ezen az oldalon, mi lesz John Harvard
név, amely alatt lesz

10
00:00:25,480 --> 00:00:28,500
egy szép üzenetet a látogatók, alatta
melyik lesz a lábléc, és

11
00:00:28,500 --> 00:00:30,590
azt mondják, néhány szerzői jogi információk.

12
00:00:30,590 --> 00:00:34,650
Ehhez nézzük meg a három hadosztály
Az oldal segítségével a tag

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

14
00:00:35,670 --> 00:00:43,880
Nyitó zárójel div, John Harvard, közel
konzol div, másik nyitott zárójel div,

15
00:00:43,880 --> 00:00:48,330
és most mi határozza meg valamit
mint szívesen kezdőlapom!

16
00:00:48,330 --> 00:00:50,420
És ne zárja be a div is.

17
00:00:50,420 --> 00:00:53,700
>> És most egy harmadik és egyben utolsó
div, szerzői jogot.

18
00:00:53,700 --> 00:00:58,250
Csak, hogy divatos, hadd használom most egy HTML
szervezet, egy szimbólum, amely képviseli

19
00:00:58,250 --> 00:01:01,140
egy karaktert, amit egyébként nem
írja a billentyűzeten.

20
00:01:01,140 --> 00:01:07,490
Különösen azt fogom tenni
jel, font, 169, pontosvessző.

21
00:01:07,490 --> 00:01:10,620
Kiderült, hogy ez a számkód
a copyright szimbólum.

22
00:01:10,620 --> 00:01:14,260
Akkor hát adja John Harvard
itt alul.

23
00:01:14,260 --> 00:01:17,180
Zárjuk a div és mentse a fájlt.

24
00:01:17,180 --> 00:01:18,910
>> Nos, mi ez a div tag?

25
00:01:18,910 --> 00:01:21,970
A div tag egyszerűen határozza meg a felosztás
az oldal, amely lényegében egy

26
00:01:21,970 --> 00:01:23,310
téglalap alakú terület.

27
00:01:23,310 --> 00:01:26,850
Tehát ebben a pillanatban az időben, van három
négyszögletes régiók egymás tetejére

28
00:01:26,850 --> 00:01:27,620
a többi.

29
00:01:27,620 --> 00:01:30,610
Tehát most, a hatás szinte
bár volt három bekezdését.

30
00:01:30,610 --> 00:01:33,490
De nem fogjuk látni annyira,
white space közöttük.

31
00:01:33,490 --> 00:01:36,170
>> Mentsük a fájlt, változtassa meg
engedélyek, és nézd meg a

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

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

34
00:01:43,040 --> 00:01:52,440
Nézzük most nyit a Chrome és a látogatás
http://localhost.CSS0.html.

35
00:01:52,440 --> 00:01:54,630
Sőt, itt a honlapon
John Harvard.

36
00:01:54,630 --> 00:01:59,370
Nézzük most stilizálhatja még egy kicsit
Pontosan segítségével néhány CSS.

37
00:01:59,370 --> 00:02:03,510
>> Vissza gedit, menjünk ebbe
első div tag, és adjunk hozzá egy stílust

38
00:02:03,510 --> 00:02:11,060
attribútum meghatározza, hogy szeretnék a
betűméret, mondjuk, 36 pixel, vagy px.

39
00:02:11,060 --> 00:02:15,650
És szeretném, ha a súlya ennek a font
hogy merész, nem pedig az alapértelmezett,

40
00:02:15,650 --> 00:02:16,980
ami normális.

41
00:02:16,980 --> 00:02:21,170
A második div, hadd adja
másik stílus attribútum, amely

42
00:02:21,170 --> 00:02:25,550
betűméret 24 pixel, így a
egy kicsit kisebb.

43
00:02:25,550 --> 00:02:28,410
Bezárás idézetek után a pontosvessző.

44
00:02:28,410 --> 00:02:33,255
>> Végül ebben a harmadik div, csináljuk
stílus egyenlő idézet, betűméret, és

45
00:02:33,255 --> 00:02:35,340
mondjuk 12 pixel ebben az időben.

46
00:02:35,340 --> 00:02:37,280
Bezárás idézet után pontosvessző.

47
00:02:37,280 --> 00:02:40,200
Figyeljük meg, akkor, hogy úgy tűnik, hogy a
meg egy kicsit a stilizálás a

48
00:02:40,200 --> 00:02:43,770
mindhárom divs használatával,
kiderül, CSS.

49
00:02:43,770 --> 00:02:47,820
Tény, hogy a szintaxist látható
azok között, idézőjelek CSS,

50
00:02:47,820 --> 00:02:50,620
kifejezetten CSS tulajdonságokat
értékekkel.

51
00:02:50,620 --> 00:02:53,910
És az első tag, ahol volt
két ilyen tulajdonságok, a betűméret és a

52
00:02:53,910 --> 00:02:57,290
font súly, egyszerűen külön
azokat pontosvesszővel.

53
00:02:57,290 --> 00:02:59,940
>> Most, csak a stílus kedvéért, azt
is tartalmaz pontosvessző at

54
00:02:59,940 --> 00:03:00,880
a végén minden sorban.

55
00:03:00,880 --> 00:03:04,270
De nem feltétlenül szükséges,
különösen akkor, ha csak egy van

56
00:03:04,270 --> 00:03:05,580
ingatlan meghatározott.

57
00:03:05,580 --> 00:03:08,370
Nézzük most mentsd el a fájlt, és töltse
a Chrome, és mi

58
00:03:08,370 --> 00:03:11,000
a nettó hatás.

59
00:03:11,000 --> 00:03:13,470
Vissza Chrome itt
nézzük kattintson újratöltése.

60
00:03:13,470 --> 00:03:15,800
>> Most már egy kicsit érdekesebb
kezdőlap John

61
00:03:15,800 --> 00:03:19,000
Harvard, ahol az első sorban a
a nevét, ami belül van, hogy a

62
00:03:19,000 --> 00:03:23,470
első div, 36 pixel magas és
félkövér, ahol a második sorban,

63
00:03:23,470 --> 00:03:27,340
amely ebben a második div, 24
pixel magas, de nem félkövér.

64
00:03:27,340 --> 00:03:31,500
És ahol a harmadik sor, hogy a harmadik
div 12 pixel magas és

65
00:03:31,500 --> 00:03:32,610
nem félkövér.

66
00:03:32,610 --> 00:03:35,380
De tegyük fel, most szeretném váltani
Mindez a szöveg fölött

67
00:03:35,380 --> 00:03:36,650
úgy, hogy ez középre.

68
00:03:36,650 --> 00:03:40,480
>> Tudtam igazítsa minden egyes
Divs, mintha középre.

69
00:03:40,480 --> 00:03:45,330
De könnyebben tudtam csomagolja azokat
három divs belsejében egy negyedik div, a

70
00:03:45,330 --> 00:03:49,360
szülő div, hogy úgy mondjam, és adja meg
, hogy div, és annak minden

71
00:03:49,360 --> 00:03:52,610
leszármazottai kell
text igazítva központ?

72
00:03:52,610 --> 00:03:54,120
Vessünk egy pillantást.

73
00:03:54,120 --> 00:03:58,510
>> Belül a gedit, menjünk vissza a
test és egy új div fel felső

74
00:03:58,510 --> 00:04:04,460
div, stílus egyenlő idézet idézet vége
text align központjában, közel

75
00:04:04,460 --> 00:04:06,250
idézet után pontosvessző.

76
00:04:06,250 --> 00:04:10,280
És most menjünk előre, és francia minden
Az ezeket a sorokat, hogy gépelt előtt.

77
00:04:10,280 --> 00:04:15,040
És alatta a harmadik div, nézzük
zárd be ezt az új div.

78
00:04:15,040 --> 00:04:18,829
>> Más szóval, mivel a három
eredeti divs most a gyerekek, így a

79
00:04:18,829 --> 00:04:22,110
beszél, egy új szülő div és én már
kifejtette, hogy szeretnék, hogy összehangolják a

80
00:04:22,110 --> 00:04:26,140
szövege a szülő div közepén
az oldal, hogy a tulajdon lesz

81
00:04:26,140 --> 00:04:28,290
örökölte az összes ilyen gyerekek.

82
00:04:28,290 --> 00:04:32,370
Sőt, mentsük el a fájlt és
vessünk egy pillantást a böngészőben.

83
00:04:32,370 --> 00:04:34,650
Nézzük újratölteni a Chrome-ban.

84
00:04:34,650 --> 00:04:37,540
És ott van ez, egy még szebb
kezdőlap John Harvard.

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