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

2
00:00:00,300 --> 00:00:04,840
>> SPEAKER: Quindi non è in realtà il migliore
progettare a mescolarsi CSS con HTML.

3
00:00:04,840 --> 00:00:08,700
Piuttosto, è meglio fattorizzare la vostra
CSS, metterlo da qualche parte centrale, e

4
00:00:08,700 --> 00:00:11,430
in qualche modo applicare alla
tag nella tua pagina web.

5
00:00:11,430 --> 00:00:15,290
Per raggiungere questo obiettivo, possiamo effettivamente fermare
utilizzando l'attributo di stile e invece

6
00:00:15,290 --> 00:00:19,290
utilizzare un tag di stile, che appartiene alla
capo di una pagina web insieme, per

7
00:00:19,290 --> 00:00:20,700
esempio, il titolo.

8
00:00:20,700 --> 00:00:24,400
>> Diamo a questo una prova e ri-implementare
una home page per John Harvard

9
00:00:24,400 --> 00:00:26,410
utilizzando il tag Style.

10
00:00:26,410 --> 00:00:28,930
Ho già ottenuto noi cominciammo
qui con tre div per

11
00:00:28,930 --> 00:00:30,260
Homepage di John Harvard.

12
00:00:30,260 --> 00:00:33,990
Ma andiamo prima ora salire a questo primo
div e aggiungere un nuovo attributo,

13
00:00:33,990 --> 00:00:38,680
cioè ID e specificare che un unico
identificatore per questo particolare div

14
00:00:38,680 --> 00:00:42,390
deve essere, per esempio, tra virgolette
"Top", un nome arbitrario, ma

15
00:00:42,390 --> 00:00:45,840
descrittivo che questa è div
infatti in cima alla mia pagina.

16
00:00:45,840 --> 00:00:48,920
>> Per il prossimo div, diamo un
diverso ID di citazione unquote

17
00:00:48,920 --> 00:00:54,080
"Medio", e diamo la terza div
un ID tra virgolette "bottom". Noi

18
00:00:54,080 --> 00:00:57,740
ora hanno tre identificatore univoco
a cui possiamo applicare un po 'di CSS

19
00:00:57,740 --> 00:01:01,210
proprietà, ma prima di far ritorno
alla testa di questa pagina.

20
00:01:01,210 --> 00:01:04,760
Appena sopra il titolo qui, io
andare avanti e definire lo stile

21
00:01:04,760 --> 00:01:07,120
e quindi chiudere lo stile.

22
00:01:07,120 --> 00:01:10,340
>> All'interno di questo ora, sto andando a definire
alcune proprietà CSS, vale a dire la

23
00:01:10,340 --> 00:01:14,550
stessi che ho già avuto in stile
attributi, ma qui essi saranno

24
00:01:14,550 --> 00:01:16,320
definite a livello centrale.

25
00:01:16,320 --> 00:01:20,880
Per farlo, ho intenzione di indicare la sterlina
simbolo seguito da top, così

26
00:01:20,880 --> 00:01:24,710
specificando che il seguente CSS
proprietà devono applicarsi a qualunque

27
00:01:24,710 --> 00:01:28,800
Elemento HTML ha l'esclusiva
identificatore del top.

28
00:01:28,800 --> 00:01:32,240
Ho quindi intenzione di avere un po 'aperta e
parentesi graffe chiuse, e ho intenzione di

29
00:01:32,240 --> 00:01:39,170
specificare, ad esempio, la dimensione è di 36
pixel, il peso del carattere è in grassetto.

30
00:01:39,170 --> 00:01:41,810
>> Per mantenere le cose pulite, sto mettendo ogni
di queste proprietà la società di propria

31
00:01:41,810 --> 00:01:44,610
linea, ma questo è solo un
convenzione stilistica.

32
00:01:44,610 --> 00:01:47,830
Sotto questo, andiamo ora definire un altro
selettore, per così dire.

33
00:01:47,830 --> 00:01:52,680
Questo per il tag HTML che ha
identificatore univoco del mezzo.

34
00:01:52,680 --> 00:01:57,540
E qui, cerchiamo di specificare una dimensione di carattere
di 24 pixel, che sotto un'altra

35
00:01:57,540 --> 00:02:01,520
selettore per fondo, e all'interno
di questo, cerchiamo di specificare un

36
00:02:01,520 --> 00:02:03,850
dimensione del font di 12 pixel.

37
00:02:03,850 --> 00:02:09,350
>> Vediamo ora salvarli, cambiarne i permessi
su, e caricare la pagina in un browser,

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

39
00:02:14,230 --> 00:02:22,260
Apriamo su Chrome e fare
http://localhost/css-1.html.

40
00:02:22,260 --> 00:02:22,960
Non male.

41
00:02:22,960 --> 00:02:26,930
Esattamente come volevo, ma mi piacerebbe
prendere le cose un passo avanti ora e

42
00:02:26,930 --> 00:02:29,050
Il testo di centro John Harvard.

43
00:02:29,050 --> 00:02:32,080
Ora per farlo, ho potuto avvolgere il
intera pagina in un div come ho

44
00:02:32,080 --> 00:02:33,800
ha fatto un esempio precedente.

45
00:02:33,800 --> 00:02:37,820
Oppure posso essere più intelligente e capire che
tutti questi div siano dentro

46
00:02:37,820 --> 00:02:42,420
Il corpo di mia pagina, quindi perché non si applica solo
una o più proprietà CSS per il corpo

47
00:02:42,420 --> 00:02:43,850
tag stesso?

48
00:02:43,850 --> 00:02:45,460
>> Per farlo, facciamolo.

49
00:02:45,460 --> 00:02:47,650
Torniamo a gedit qui.

50
00:02:47,650 --> 00:02:52,460
Facciamo scorrere indietro fino alla modifica Stile,
e cerchiamo di specificare un selettore solo

51
00:02:52,460 --> 00:02:54,520
utilizzando tale nome tag, corpo.

52
00:02:54,520 --> 00:03:00,580
Sotto di esso, mettiamo i nostri parentesi graffe
seguito dal centro text-align.

53
00:03:00,580 --> 00:03:05,580
Passiamo ora salvare la pagina e ricaricare
all'interno di tale browser.

54
00:03:05,580 --> 00:03:08,090
Ricarica in Chrome, e voilà.

55
00:03:08,090 --> 00:03:11,000
Ora abbiamo la pagina di John Harvard
centrato come previsto.

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