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

2
00:00:00,300 --> 00:00:04,840
>> SPEAKER: Joten se oikeastaan ​​ole paras
suunnitella sekoittua CSS HTML.

3
00:00:04,840 --> 00:00:08,700
Pikemminkin se on parasta tekijä ulos
CSS, laita se jonnekin Keski-ja

4
00:00:08,700 --> 00:00:11,430
jotenkin soveltaa sitä
Tunnisteet Web-sivun.

5
00:00:11,430 --> 00:00:15,290
Tämän saavuttamiseksi, voimme todella lopettaa
käyttäen tyyliattribuutti ja sen sijaan

6
00:00:15,290 --> 00:00:19,290
Käytä Style tag, joka kuuluu
johtaja web-sivun ohella varten

7
00:00:19,290 --> 00:00:20,700
Esimerkiksi otsikko.

8
00:00:20,700 --> 00:00:24,400
>> Annetaanpa tämän kokeilla ja uudelleen toteuttaa
kotisivun John Harvard

9
00:00:24,400 --> 00:00:26,410
käyttäen Style tag.

10
00:00:26,410 --> 00:00:28,930
Olen jo saanut meidät alkoi
täällä kolme divs varten

11
00:00:28,930 --> 00:00:30,260
John Harvardin kotisivu.

12
00:00:30,260 --> 00:00:33,990
Mutta katsotaanpa ensin nyt mennä jopa tämän ensimmäisen
div ja lisää uuden määritteen,

13
00:00:33,990 --> 00:00:38,680
eli ID, ja täsmennetään, että yksilöllinen
tunniste tähän nimenomaiseen div

14
00:00:38,680 --> 00:00:42,390
on esimerkiksi lainaus lainaus
"Top", mielivaltainen nimi, mutta

15
00:00:42,390 --> 00:00:45,840
kuvaileva, sillä tämä div on
todellakin yläreunassa sivuni.

16
00:00:45,840 --> 00:00:48,920
>> Seuraavan div Annetaan sen
eri ID lainaus lainaus

17
00:00:48,920 --> 00:00:54,080
"Keskellä" ja Annetaanpa kolmannen div
ID lainaus lainaus "alhaalta". Me

18
00:00:54,080 --> 00:00:57,740
nyt kolme yksilöllinen tunniste
johon voimme soveltaa joitakin CSS

19
00:00:57,740 --> 00:01:01,210
ominaisuuksia, mutta ensin on paluu
päähän tällä sivulla.

20
00:01:01,210 --> 00:01:04,760
Yläpuolella otsikko täällä, Otan
mennä eteenpäin ja määritellä tyyli

21
00:01:04,760 --> 00:01:07,120
ja sulje tyyliin.

22
00:01:07,120 --> 00:01:10,340
>> Inside tämän nyt, aion määritellä
joitakin CSS-ominaisuuksia, eli

23
00:01:10,340 --> 00:01:14,550
samoja Olen aiemmin ollut Style
attribuutteja, mutta tässä he ovat

24
00:01:14,550 --> 00:01:16,320
keskitetysti määritelty.

25
00:01:16,320 --> 00:01:20,880
Voit tehdä niin, aion määritellä punnan
symboli ja sen jälkeen päälle, jolloin

26
00:01:20,880 --> 00:01:24,710
täsmennetään, että seuraavat CSS
ominaisuudet olisi sovellettava riippumatta

27
00:01:24,710 --> 00:01:28,800
HTML-elementti on ainutlaatuinen
tunniste alkuun.

28
00:01:28,800 --> 00:01:32,240
Olen sitten menossa olla avoin ja
suljettu aaltosulkeita, ja aion

29
00:01:32,240 --> 00:01:39,170
määritellä vaikkapa fonttikoko on 36
pikseliä, fontti Painon on oltava rohkea.

30
00:01:39,170 --> 00:01:41,810
>> Pitää asiat puhtaana, Laitan kunkin
Näiden ominaisuuksien nyt omasta

31
00:01:41,810 --> 00:01:44,610
linja, mutta se on vain
tyylillisiä sopimusta.

32
00:01:44,610 --> 00:01:47,830
Tämän alapuolella, nyt nyt määrittää toista
valitsin, niin sanoakseni.

33
00:01:47,830 --> 00:01:52,680
Tämä yksi HTML-tunniste, joka on
yksilöllinen tunniste keskellä.

34
00:01:52,680 --> 00:01:57,540
Ja täällä, katsotaanpa määritä fontin kokoa
24 pikseliä, alla, että toinen

35
00:01:57,540 --> 00:02:01,520
valitsin pohja-, ja sisältä
Tämän, nyt määritellä

36
00:02:01,520 --> 00:02:03,850
fonttikokoa 12 pikseliä.

37
00:02:03,850 --> 00:02:09,350
>> Katsotaanpa nyt tallentaa, muuttaa oikeuksia
päälle, ja lataa tämä sivu selaimessa,

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

39
00:02:14,230 --> 00:02:22,260
Avataan Chrome ja vierailla
http://localhost/css-1.html.

40
00:02:22,260 --> 00:02:22,960
Ei paha.

41
00:02:22,960 --> 00:02:26,930
Juuri niin kuin on tarkoitettu, mutta haluaisin
ottaa asiat askel pidemmälle nyt ja

42
00:02:26,930 --> 00:02:29,050
keskusta John Harvardin tekstiä.

43
00:02:29,050 --> 00:02:32,080
Nyt tehdä niin, voisin kietoa
koko sivun div kuin minä

44
00:02:32,080 --> 00:02:33,800
teki aiemmin esimerkki.

45
00:02:33,800 --> 00:02:37,820
Tai voin olla viisaampi ja ymmärtää, että
kaikki nämä divs ovat sisäpuolella

46
00:02:37,820 --> 00:02:42,420
sivuni ruumis, joten miksi ei vain sovelleta
yksi tai useampi CSS-ominaisuuksia kehon

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

48
00:02:43,850 --> 00:02:45,460
>> Voit tehdä niin, tehdään tämä.

49
00:02:45,460 --> 00:02:47,650
Mennään takaisin gedit täällä.

50
00:02:47,650 --> 00:02:52,460
Katsotaanpa siirry takaisin ylös tyyli tag,
ja lähdetään määritä valitsin juuri

51
00:02:52,460 --> 00:02:54,520
kyseisten elementtien nimi, Body.

52
00:02:54,520 --> 00:03:00,580
Alla, katsotaanpa laittaa meidän aaltosulkeita
seuraa text-align center.

53
00:03:00,580 --> 00:03:05,580
Katsotaanpa nyt tallentaa sivun ja lataa
se sisällä kyseisen selaimen.

54
00:03:05,580 --> 00:03:08,090
Reload Chrome, ja voila.

55
00:03:08,090 --> 00:03:11,000
Meillä on nyt John Harvardin sivu
keskitetty kuten tarkoitettu.

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