Tagapagsalita: Ito ay lumiliko out na HTML ay hindi ang tanging wika na maaari mong gamitin sa loob ng isang web page. Maaari mong gamitin ang isang bagay na tinatawag na CSS, o Cascading Style Sheet, pati na rin. Binibigyang-daan ka ng CSS sa iyo upang tukuyin marami pang iba tumpak ang aesthetics ng isang web pahina, kabilang ang layout at mga laki at mga kulay at mga font at marami pang iba. Halimbawa, lumikha ng isang web page ipaalam dito tinatawag CSS0 na kumakatawan sa isang home page para sa, sabihin nating, John Harvard. 

Sa pahinang ito, kakailanganin naming John Harvard ni pangalanan, sa ilalim kung saan ay magiging gandang mensahe para sa kanyang mga bisita, sa ilalim na kung saan ay magiging isang footer, na may sabihin, ang ilang mga impormasyon sa copyright. Upang gawin ito, tukuyin ang tatlong dibisyon ipaalam para sa pahina gamit ang isang tag na na tinatawag na div. Buksan bracket div, John Harvard, malapit bracket div, isa pang bukas bracket div, at ngayon makikita tukuyin kami ng isang bagay tulad ng, maligayang pagdating sa aking home page! At isara ni ito div ipaalam, pati na rin. 

At ngayon, isang third at huling div, copyright. Lamang na maging fancy, hayaan mo akong gumamit ngayon ng isang HTML entity, isang simbolo na kumakatawan sa isang character na hindi mo magagawa kung hindi man nagta-type sa iyong keyboard. Sa partikular, ako pagpunta sa gawin ampersand, pound, 169, tuldok-kuwit. Ginagawang out na ang numeric code para sa simbolo ng copyright. Pagkatapos sabihin tukuyin John Harvard dito sa ibaba. Isara ng div at i-save ang file Hayaan. 

Ngayon, kung ano ito div tag na ito? Tinutukoy lamang ng div tag isang sangay ng pahina, na kung saan ay mahalagang isang hugis-parihaba rehiyon. Kaya sa ito sandali sa oras, mayroon akong tatlong hugis-parihaba rehiyon, isa sa tuktok sa iba pang mga. Kaya para sa ngayon, ang epekto ay halos kasing bagaman Mayroon akong tatlong mga talata. Ngunit hindi namin makikita pa masyadong bilang magkano puting espasyo sa pagitan ng mga ito. 

I-save ang file na ito Hayaan, baguhin nito mga pahintulot, at kumuha ng isang hitsura para sa isang sandali sa Chrome. Chmod isang + r CSS0.html. Buksan up ang Chrome at pagbisita Sabihin ngayon http://localhost.CSS0.html. Sa katunayan, narito ang isang home page para sa John Harvard. Ngayon stylize ni ito ng kaunti pa sa Hayaan tumpak gamit ang ilan sa CSS. 

Bumalik sa gedit, sabihin pumunta sa ito unang div tag at magdagdag ng estilo ipatungkol ng pagtukoy na Gusto ko ng laki ng font ng, sabihin nating, 36 pixels, o px. At gusto ko ang bigat ng font upang maging bold sa halip na ang default na, na kung saan ay normal. Para sa ikalawang div, sabihin tukuyin isa pang estilo katangiang iyon ay may isang laki ng 24 pixel font, kaya Medyo mas maliit. Isara ang mga quote pagkatapos ng tuldok-kuwit. 

Panghuli, sa ganitong mga third div, ni gawin ipaalam ay katumbas ng estilo laki quote, font, at hayaan sabihin ng 12 pixels oras na ito. Isara quote pagkatapos ng tuldok-kuwit. Pansinin pagkatapos na mukhang ako na magkaroon tinukoy ng kaunting estilisasyon para sa bawat isa sa mga tatlong divs gamit, ito ay lumiliko out, CSS. Sa katunayan, ang syntax na iyong nakikita sa sa pagitan ng mga double quote ay CSS, partikular na mga katangian ng CSS may halaga. At para sa na unang tag, na kung saan ako ay nagkaroon ng dalawang naturang mga pag-aari, laki ng font at bigat ng font, pinaghiwalay ko lang sa kanila na may semicolon. 

Ngayon, lamang para sa kapanan ng estilo, ang ko Kasama rin semicolons sa sa dulo ng bawat linya. Ngunit ang mga ito ay hindi mahigpit na kinakailangan, lalo na kapag mayroon ka lamang isang tinukoy ng ari-arian. Hayaan ang i-save ni ngayon ang file at i-reload sa Chrome, at makita kung ano ang ang net na epekto ay. Bumalik sa Chrome dito, mag-click I-reload ipaalam. 

Ngayon kami ay may isang bahagyang mas kawili-wiling home page para sa John Harvard, kung saan ang unang linya na may ang kanyang pangalan, na kung saan ay nasa loob ng na unang div, 36 pixel ang taas at din boldface, kung saan ang pangalawang linya, na kung saan ay sa na pangalawang div, ay 24 pixel ang taas, ngunit hindi boldface. At kung saan ang ikatlong linya sa na ang mga third div ay 12 pixel ang taas at din hindi boldface. Ngunit ipagpalagay na ngayon Gusto kong shift lahat ng ito sa paglipas ng teksto tulad na ito ay nakasentro. 

Kaya kong ihanay ang bawat isa sa mga indibidwal divs bilang nakasentro. Ngunit nang mas madali, kaya kong balutin mga tatlong divs sa loob ng 1/4 div, isang magulang div, kaya na magsalita, at tukuyin na na div at lahat ng mga kaapu-apuhan ay dapat na nakahanay teksto center? Hayaan ang kumuha ng isang hitsura. 

Sa loob ng gedit, sabihin bumalik sa aking katawan at magdagdag ng bagong div up tuktok na may div, ay katumbas ng estilo quote magpanipi Ihanay sa teksto center, malapit Quote pagkatapos ng tuldok-kuwit. At ngayon, sabihin sige at mag-urong lahat ng mga linya na namin nai-type bago. At sa ibaba na ang mga third div, sabihin isara ang bagong div. 

Sa ibang salita, dahil sa mga tatlong orihinal divs na ngayon sa mga bata, kaya upang magsalita, ng isang bagong magulang div at na hindi ko na tinukoy na nais kong ihanay ang teksto ng magulang na div sa sentro ng pahina, ari-arian na magiging minana sa pamamagitan ng lahat ng mga bata. Sa katunayan, sabihin i-save ng mga file at tingnan sa isang browser. Ni-reload sa Chrome Hayaan. At doon ay mayroon kaming ito, ang isang pantay na nicer home page para sa John Harvard.