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

2
00:00:00,300 --> 00:00:04,840
>> Spreker: So dit is eintlik nie die beste
ontwerp CSS te meng met HTML.

3
00:00:04,840 --> 00:00:08,700
Inteendeel, dit is die beste om faktor uit jou
CSS, sit dit iewers sentrale en

4
00:00:08,700 --> 00:00:11,430
een of ander manier toe te pas op die
tags in jou webblad.

5
00:00:11,430 --> 00:00:15,290
Om dit te bereik, kan ons eintlik stop
gebruik van die styl kenmerk en in plaas daarvan

6
00:00:15,290 --> 00:00:19,290
gebruik om 'n Styl tag, wat deel uitmaak van die
hoof van 'n web bladsy langsaan vir

7
00:00:19,290 --> 00:00:20,700
Byvoorbeeld, jou titel.

8
00:00:20,700 --> 00:00:24,400
>> Kom ons gee dit 'n probeer en weer te implementeer
'n tuisblad vir John Harvard

9
00:00:24,400 --> 00:00:26,410
gebruik van die styl-etiket.

10
00:00:26,410 --> 00:00:28,930
Ek het reeds gekry ons begin
hier met drie divs vir

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

12
00:00:30,260 --> 00:00:33,990
Maar laat ons nou eers gaan na die eerste
div en voeg 'n nuwe kenmerk,

13
00:00:33,990 --> 00:00:38,680
naamlik ID, en spesifiseer dat 'n unieke
identifiseerder vir hierdie spesifieke div

14
00:00:38,680 --> 00:00:42,390
sal wees, byvoorbeeld, kwotasie unquote
"Top" 'n arbitrêre naam nie, maar

15
00:00:42,390 --> 00:00:45,840
beskrywende in dat dit div is
inderdaad aan die bokant van my bladsy.

16
00:00:45,840 --> 00:00:48,920
>> Vir die volgende div, kom ons gee dit 'n
verskillende ID van kwotasie unquote

17
00:00:48,920 --> 00:00:54,080
"Middel" en laat ons gee die derde div
'n ID van kwotasie unquote "onder." Ons

18
00:00:54,080 --> 00:00:57,740
het nou drie unieke identifiseerder
waaraan ons kan 'n paar CSS toepassing

19
00:00:57,740 --> 00:01:01,210
eienskappe, maar die eerste, laat se terugkeer
aan die hoof van hierdie bladsy.

20
00:01:01,210 --> 00:01:04,760
Net bokant die titel hier, ek sal
gaan voort en styl definieer

21
00:01:04,760 --> 00:01:07,120
en dan naby styl.

22
00:01:07,120 --> 00:01:10,340
>> Binnekant van dit, ek gaan om te definieer
sommige CSS eienskappe, naamlik die

23
00:01:10,340 --> 00:01:14,550
dieselfde mense wat ek voorheen in styl gehad
eienskappe, maar hier is hulle sal wees

24
00:01:14,550 --> 00:01:16,320
sentraal gedefinieer.

25
00:01:16,320 --> 00:01:20,880
Om dit te doen, ek gaan die pond te spesifiseer
simbool, gevolg deur die top, en daardeur

26
00:01:20,880 --> 00:01:24,710
spesifiseer dat die volgende CSS
eienskappe moet aansoek doen om alles

27
00:01:24,710 --> 00:01:28,800
HTML element het die unieke
identifikasie van die top.

28
00:01:28,800 --> 00:01:32,240
Ek is dan gaan 'n paar oop te hê en
geslote krulhakies, en ek gaan

29
00:01:32,240 --> 00:01:39,170
spesifiseer, sê, sal lettergrootte wees 36
pixels, sal font gewig vet.

30
00:01:39,170 --> 00:01:41,810
>> Dinge skoon te hou, ek sit elke
van hierdie eiendomme nou op sy eie

31
00:01:41,810 --> 00:01:44,610
lyn, maar dit is net 'n
stilistiese konvensie.

32
00:01:44,610 --> 00:01:47,830
Onder hierdie, laat ons nou definieer 'n ander
selector, om so te praat.

33
00:01:47,830 --> 00:01:52,680
Hierdie een vir die HTML tag wat
unieke identifikasie van die middel.

34
00:01:52,680 --> 00:01:57,540
En hier, laat ons spesifiseer 'n lettergrootte
van 24 pixels, hieronder wat 'n ander

35
00:01:57,540 --> 00:02:01,520
selector vir onderkant, en binne
van daardie, laat ons gee 'n

36
00:02:01,520 --> 00:02:03,850
lettergrootte van 12 pixels.

37
00:02:03,850 --> 00:02:09,350
>> Kom ons nou ook red, verander die regte
op, en laai hierdie bladsy in 'n leser,

38
00:02:09,350 --> 00:02:14,230
chmod 'n plus r css-1.html.

39
00:02:14,230 --> 00:02:22,260
Kom ons oop Chrome en besoek
http://localhost/css-1.html.

40
00:02:22,260 --> 00:02:22,960
Nie sleg nie.

41
00:02:22,960 --> 00:02:26,930
Presies soos wat ek bedoel nie, maar ek wil
neem dinge 'n stap verder en nou

42
00:02:26,930 --> 00:02:29,050
sentrum John Harvard se teks.

43
00:02:29,050 --> 00:02:32,080
Nou om dit te doen, kan ek draai die
hele bladsy in 'n div as ek

44
00:02:32,080 --> 00:02:33,800
het 'n vroeëre voorbeeld.

45
00:02:33,800 --> 00:02:37,820
Of ek kan meer slim en besef dat
al hierdie divs is binnekant van

46
00:02:37,820 --> 00:02:42,420
my bladsy se liggaam is, so hoekom nie net van toepassing
een of meer CSS eienskappe vir die liggaam

47
00:02:42,420 --> 00:02:43,850
self merk?

48
00:02:43,850 --> 00:02:45,460
>> Om dit te doen, laat ons dit doen.

49
00:02:45,460 --> 00:02:47,650
Kom ons gaan terug na gedit hier.

50
00:02:47,650 --> 00:02:52,460
Kom ons blaai terug na die Style tag,
en laat ons gee 'n selector net

51
00:02:52,460 --> 00:02:54,520
gebruik van daardie merker se naam, liggaam.

52
00:02:54,520 --> 00:03:00,580
Hieronder wat, laat ons ons krulhakies
gevolg deur text-align sentrum.

53
00:03:00,580 --> 00:03:05,580
Kom ons kyk nou na die bladsy stoor en oproep
dit binnekant van die leser.

54
00:03:05,580 --> 00:03:08,090
Reload in Chrome, en siedaar.

55
00:03:08,090 --> 00:03:11,000
Ons het nou John Harvard se bladsy
gesentreer as ons bedoel is.

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