>> SPEAKER: Joten se oikeastaan 窶銀黍le paras suunnitella sekoittua CSS HTML.
Pikemminkin se on parasta tekijﾃ､ ulos CSS, laita se jonnekin Keski-ja
jotenkin soveltaa sitﾃ､ Tunnisteet Web-sivun.
Tﾃ､mﾃ､n saavuttamiseksi, voimme todella lopettaa kﾃ､yttﾃ､en tyyliattribuutti ja sen sijaan
Kﾃ､ytﾃ､ Style tag, joka kuuluu johtaja web-sivun ohella varten
Esimerkiksi otsikko.
>> Annetaanpa tﾃ､mﾃ､n kokeilla ja uudelleen toteuttaa kotisivun John Harvard
kﾃ､yttﾃ､en Style tag.
Olen jo saanut meidﾃ､t alkoi tﾃ､ﾃ､llﾃ､ kolme divs varten
John Harvardin kotisivu.
Mutta katsotaanpa ensin nyt mennﾃ､ jopa tﾃ､mﾃ､n ensimmﾃ､isen div ja lisﾃ､ﾃ､ uuden mﾃ､ﾃ､ritteen,
eli ID, ja tﾃ､smennetﾃ､ﾃ､n, ettﾃ､ yksilﾃｶllinen tunniste tﾃ､hﾃ､n nimenomaiseen div
on esimerkiksi lainaus lainaus "Top", mielivaltainen nimi, mutta
kuvaileva, sillﾃ､ tﾃ､mﾃ､ div on todellakin ylﾃ､reunassa sivuni.
>> Seuraavan div Annetaan sen eri ID lainaus lainaus
"Keskellﾃ､" ja Annetaanpa kolmannen div ID lainaus lainaus "alhaalta". Me
nyt kolme yksilﾃｶllinen tunniste johon voimme soveltaa joitakin CSS
ominaisuuksia, mutta ensin on paluu pﾃ､ﾃ､hﾃ､n tﾃ､llﾃ､ sivulla.
Ylﾃ､puolella otsikko tﾃ､ﾃ､llﾃ､, Otan mennﾃ､ eteenpﾃ､in ja mﾃ､ﾃ､ritellﾃ､ tyyli
ja sulje tyyliin.
>> Inside tﾃ､mﾃ､n nyt, aion mﾃ､ﾃ､ritellﾃ､ joitakin CSS-ominaisuuksia, eli
samoja Olen aiemmin ollut Style attribuutteja, mutta tﾃ､ssﾃ､ he ovat
keskitetysti mﾃ､ﾃ､ritelty.
Voit tehdﾃ､ niin, aion mﾃ､ﾃ､ritellﾃ､ punnan symboli ja sen jﾃ､lkeen pﾃ､ﾃ､lle, jolloin
tﾃ､smennetﾃ､ﾃ､n, ettﾃ､ seuraavat CSS ominaisuudet olisi sovellettava riippumatta
HTML-elementti on ainutlaatuinen tunniste alkuun.
Olen sitten menossa olla avoin ja suljettu aaltosulkeita, ja aion
mﾃ､ﾃ､ritellﾃ､ vaikkapa fonttikoko on 36 pikseliﾃ､, fontti Painon on oltava rohkea.
>> Pitﾃ､ﾃ､ asiat puhtaana, Laitan kunkin Nﾃ､iden ominaisuuksien nyt omasta
linja, mutta se on vain tyylillisiﾃ､ sopimusta.
Tﾃ､mﾃ､n alapuolella, nyt nyt mﾃ､ﾃ､rittﾃ､ﾃ､ toista valitsin, niin sanoakseni.
Tﾃ､mﾃ､ yksi HTML-tunniste, joka on yksilﾃｶllinen tunniste keskellﾃ､.
Ja tﾃ､ﾃ､llﾃ､, katsotaanpa mﾃ､ﾃ､ritﾃ､ fontin kokoa 24 pikseliﾃ､, alla, ettﾃ､ toinen
valitsin pohja-, ja sisﾃ､ltﾃ､ Tﾃ､mﾃ､n, nyt mﾃ､ﾃ､ritellﾃ､
fonttikokoa 12 pikseliﾃ､.
>> Katsotaanpa nyt tallentaa, muuttaa oikeuksia pﾃ､ﾃ､lle, ja lataa tﾃ､mﾃ､ sivu selaimessa,
chmod plus r css-1.html.
Avataan Chrome ja vierailla http://localhost/css-1.html.
Ei paha.
Juuri niin kuin on tarkoitettu, mutta haluaisin ottaa asiat askel pidemmﾃ､lle nyt ja
keskusta John Harvardin tekstiﾃ､.
Nyt tehdﾃ､ niin, voisin kietoa koko sivun div kuin minﾃ､
teki aiemmin esimerkki.
Tai voin olla viisaampi ja ymmﾃ､rtﾃ､ﾃ､, ettﾃ､ kaikki nﾃ､mﾃ､ divs ovat sisﾃ､puolella
sivuni ruumis, joten miksi ei vain sovelleta yksi tai useampi CSS-ominaisuuksia kehon
tag itse?
>> Voit tehdﾃ､ niin, tehdﾃ､ﾃ､n tﾃ､mﾃ､.
Mennﾃ､ﾃ､n takaisin gedit tﾃ､ﾃ､llﾃ､.
Katsotaanpa siirry takaisin ylﾃｶs tyyli tag, ja lﾃ､hdetﾃ､ﾃ､n mﾃ､ﾃ､ritﾃ､ valitsin juuri
kyseisten elementtien nimi, Body.
Alla, katsotaanpa laittaa meidﾃ､n aaltosulkeita seuraa text-align center.
Katsotaanpa nyt tallentaa sivun ja lataa se sisﾃ､llﾃ､ kyseisen selaimen.
Reload Chrome, ja voila.
Meillﾃ､ on nyt John Harvardin sivu keskitetty kuten tarkoitettu.