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

2
00:00:00,290 --> 00:00:03,310
>> SPEAKER: Izrādās, ka HTML nav
vienīgā valoda, ko var izmantot iekšpusē

3
00:00:03,310 --> 00:00:03,895
no tīmekļa lapas.

4
00:00:03,895 --> 00:00:08,100
Jūs varat izmantot kaut ko sauc par CSS, vai
Cascading Style Sheets, kā arī.

5
00:00:08,100 --> 00:00:12,120
CSS ļauj norādīt daudz vairāk
precīzi estētika web

6
00:00:12,120 --> 00:00:16,930
lapas, ieskaitot izkārtojumu un izmēriem, un
krāsas un fontus, un daudz ko citu.

7
00:00:16,930 --> 00:00:20,820
Piemēram, pieņemsim izveidot mājas lapu
šeit sauc CSS0, kas apzīmē

8
00:00:20,820 --> 00:00:22,740
mājas lapa, piemēram, John Harvard.

9
00:00:22,740 --> 00:00:25,480
>> Šajā lapā, mums būs John Harvard s
nosaukums, zem kura būs

10
00:00:25,480 --> 00:00:28,500
jauka ziņa par saviem apmeklētājiem, zem
kas būs kājene, ar

11
00:00:28,500 --> 00:00:30,590
saka, daži autortiesību informāciju.

12
00:00:30,590 --> 00:00:34,650
Lai to izdarītu, pieņemsim definēt trīs nodaļas
par lapu, izmantojot tagu

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

14
00:00:35,670 --> 00:00:43,880
Atvērt kronšteins div, John Harvard, close
kronšteins div, vēl viens atklātā kronšteins div,

15
00:00:43,880 --> 00:00:48,330
un tagad mēs norādīt kaut ko
piemēram, welcome uz manu mājas lapā!

16
00:00:48,330 --> 00:00:50,420
Un pieņemsim slēgt šo div, kā labi.

17
00:00:50,420 --> 00:00:53,700
>> Un tagad trešais un pēdējais
div, autortiesības.

18
00:00:53,700 --> 00:00:58,250
Tikai, lai būtu iedomātā, ļaujiet man izmantot tagad HTML
persona, simbols, kas apzīmē

19
00:00:58,250 --> 00:01:01,140
raksturu, kas jūs varētu citādi
rakstīt uz tastatūras.

20
00:01:01,140 --> 00:01:07,490
Jo īpaši, es esmu gatavojas darīt
Ampersand, mārciņa, 169, semikols.

21
00:01:07,490 --> 00:01:10,620
Izrādās, ka ir ciparu kods
par autortiesību simbolu.

22
00:01:10,620 --> 00:01:14,260
Tad pieņemsim precizēt John Harvard
šeit apakšā.

23
00:01:14,260 --> 00:01:17,180
Pieņemsim aizveriet div un saglabājiet failu.

24
00:01:17,180 --> 00:01:18,910
>> Tagad, kas ir šī div tagu?

25
00:01:18,910 --> 00:01:21,970
Div tag vienkārši nosaka sadalījumu
lapas, kas ir pēc būtības

26
00:01:21,970 --> 00:01:23,310
taisnstūrveida apgabals.

27
00:01:23,310 --> 00:01:26,850
Tātad šajā brīdī, man ir trīs
taisnstūra reģioniem, vienu uz augšu

28
00:01:26,850 --> 00:01:27,620
no otras puses.

29
00:01:27,620 --> 00:01:30,610
Tātad tagad, efekts ir gandrīz tikpat
lai gan man bija trīs punktus.

30
00:01:30,610 --> 00:01:33,490
Bet mēs neredzam tik daudz
atstarpe starp tām.

31
00:01:33,490 --> 00:01:36,170
>> Pieņemsim saglabājiet šo failu, mainīt tās
atļaujas, un to apskatīt

32
00:01:36,170 --> 00:01:37,990
brīdis Chrome.

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

34
00:01:43,040 --> 00:01:52,440
Pieņemsim tagad atvērt Chrome un apmeklējumu
http://localhost.CSS0.html.

35
00:01:52,440 --> 00:01:54,630
Patiešām, šeit ir mājas lapa
John Harvard.

36
00:01:54,630 --> 00:01:59,370
Pieņemsim tagad Stylize to nedaudz vairāk
Tieši izmantojot dažus CSS.

37
00:01:59,370 --> 00:02:03,510
>> Atpakaļ gedit, iesim uz to
Pirmais div tagu un pievienot stilu

38
00:02:03,510 --> 00:02:11,060
atribūtu norādot, ka es gribētu
fonta lielumu, teiksim, 36 pikseļi vai px.

39
00:02:11,060 --> 00:02:15,650
Un es gribētu svaru šo fontu
jābūt drosmīgai, nevis noklusējuma,

40
00:02:15,650 --> 00:02:16,980
kas ir normāli.

41
00:02:16,980 --> 00:02:21,170
Attiecībā uz otro div, pieņemsim precizēt
cita stila atribūtu, kas ir

42
00:02:21,170 --> 00:02:25,550
fonta izmērs 24 pikseļi, tāpēc
nedaudz mazāks.

43
00:02:25,550 --> 00:02:28,410
Aizvērt citē pēc semikolu.

44
00:02:28,410 --> 00:02:33,255
>> Visbeidzot, šajā trešajā div, pieņemsim do
stils vienāds quote, fonta lielumu, un

45
00:02:33,255 --> 00:02:35,340
teiksim 12 pikseļi šoreiz.

46
00:02:35,340 --> 00:02:37,280
Aizvērt quote pēc semikolu.

47
00:02:37,280 --> 00:02:40,200
Ievērojiet, tad man šķiet, ir
norādīts mazliet stilizācijas par

48
00:02:40,200 --> 00:02:43,770
Katrā no šiem trim divs lieto,
izrādās, CSS.

49
00:02:43,770 --> 00:02:47,820
Patiesībā, sintakse, ka jūs redzat
starp šīm pēdiņas ir CSS,

50
00:02:47,820 --> 00:02:50,620
īpaši CSS īpašības
ar vērtībām.

51
00:02:50,620 --> 00:02:53,910
Un šī pirmā tag, kur man bija
divas šādas īpašības, fonta izmērs un

52
00:02:53,910 --> 00:02:57,290
fontu svaru, es vienkārši atdalītas
tos ar semikolu.

53
00:02:57,290 --> 00:02:59,940
>> Tagad, tikai par stilu dēļ, es
iekļauti arī semikoliem at

54
00:02:59,940 --> 00:03:00,880
gals katrā rindā.

55
00:03:00,880 --> 00:03:04,270
Bet viņi nav absolūti nepieciešams,
jo īpaši, ja jums ir tikai viens

56
00:03:04,270 --> 00:03:05,580
īpašums definēts.

57
00:03:05,580 --> 00:03:08,370
Pieņemsim tagad saglabājiet failu un pārlādēt
Chrome, un redzēt, kas

58
00:03:08,370 --> 00:03:11,000
neto ietekme ir.

59
00:03:11,000 --> 00:03:13,470
Atpakaļ Chrome šeit
pieņemsim noklikšķiniet pārlādētu.

60
00:03:13,470 --> 00:03:15,800
>> Tagad mums ir nedaudz vairāk interesanti
mājas lapa John

61
00:03:15,800 --> 00:03:19,000
Harvard, kur pirmajā rindā ar
viņa vārds, kas ir iekšpusē, kas

62
00:03:19,000 --> 00:03:23,470
Pirmais div, ir 36 pikseļi garš, un arī
trekniem, kurā otrā rinda,

63
00:03:23,470 --> 00:03:27,340
, kas ir minētajā otrajā div, ir 24
pikseļu garš, bet ne treknrakstu.

64
00:03:27,340 --> 00:03:31,500
Un kuru trešajā rindā šajā trešdaļā
div ir 12 pikseļi garš, un arī

65
00:03:31,500 --> 00:03:32,610
nav treknrakstā.

66
00:03:32,610 --> 00:03:35,380
Bet pieņemsim, ka tagad es gribētu, lai pārslēgtos
visu šo tekstu vairāk

67
00:03:35,380 --> 00:03:36,650
tā, ka tas ir centrēts.

68
00:03:36,650 --> 00:03:40,480
>> Es varētu saskaņot katra indivīda
divs kā ir centrēts.

69
00:03:40,480 --> 00:03:45,330
Bet vieglāk, es varētu wrap tos
trīs divs iekšpusē ceturto div,

70
00:03:45,330 --> 00:03:49,360
vecākiem div, tā sakot, un norādīt
ka šis div un visas tās

71
00:03:49,360 --> 00:03:52,610
pēcnācēji būtu
Teksts saskaņots centru?

72
00:03:52,610 --> 00:03:54,120
Pieņemsim to apskatīt.

73
00:03:54,120 --> 00:03:58,510
>> Iekšpusē gedit, iesim atpakaļ uz manu
ķermeņa un pievienot jaunu div līdz augšējai

74
00:03:58,510 --> 00:04:04,460
div, stils ir vienāds quote likt pēdiņas beigās
teksta saskaņot centrā, netālu

75
00:04:04,460 --> 00:04:06,250
quote pēc semikolu.

76
00:04:06,250 --> 00:04:10,280
Un tagad, iesim uz priekšu un ievilkums visu
Šo līniju, ko mēs drukāti pirms tam.

77
00:04:10,280 --> 00:04:15,040
Un zem šīs trešās div, pieņemsim
aizvērt šo jauno div.

78
00:04:15,040 --> 00:04:18,829
>> Citiem vārdiem, jo ​​tie trīs
sākotnējie divs tagad bērni, tāpēc, lai

79
00:04:18,829 --> 00:04:22,110
runā, par jaunā mātes div, un es esmu
norādīts, ka es gribētu, lai saskaņotu

80
00:04:22,110 --> 00:04:26,140
tekstu šā mātesuzņēmuma div centrā
lapas, ka īpašums tiks

81
00:04:26,140 --> 00:04:28,290
mantoja visus šos bērnus.

82
00:04:28,290 --> 00:04:32,370
Tiešām, pieņemsim saglabājiet failu un
ieskatieties pārlūkprogrammā.

83
00:04:32,370 --> 00:04:34,650
Pieņemsim pārlādēt Chrome.

84
00:04:34,650 --> 00:04:37,540
Un tur mums ir tā, vēl jaukāk
mājas lapa John Harvard.

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