SPEAKER: Joten se oikeastaan ​​ole 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.