Dahil ang pag-imbento ng hypertext markup na wika, HTML, ang mga konsepto ng layout at layout ng mga dokumento sa web ay nagbago nang malaki. Sa halos kumpletong suporta ng mga tanyag na browser para sa mga pamantayan ng style na style ng cascading na CSS at CSS2, naging posible na maimpluwensyahan ang halos anumang aspeto ng visual na pagtatanghal ng isang dokumento. Halimbawa, maaari mong gawing may kulay ang background ng isang link, puno ng ilang imahe, at nagbabago din depende sa mga pagkilos ng gumagamit.
Kailangan
- - ang kakayahang i-edit ang teksto ng dokumento o ang teksto ng mga sheet ng estilo ng dokumento;
- - isang text editor na nagbibigay-daan sa iyo upang i-save ang dokumento sa orihinal na encoding.
Panuto
Hakbang 1
Gawin ang background ng link na pantay na pinunan ng isang random na kulay sa pamamagitan ng pagdaragdag ng impormasyon ng istilong inline sa isang elemento. Magdagdag ng istilo sa mga katangian ng Isang elemento na naaayon sa link na ang background ay nais mong baguhin. Sa nilalaman ng istilo ng katangian, ilagay ang background-color CSS na pag-aari na may ibinigay na halaga, na tamang pagkakakilanlan para sa kulay ng background. Halimbawa, maaaring ganito ang hitsura:
teksto ng link
Hakbang 2
Tukuyin ang background ng link sa isang panlabas o naka-embed na sheet ng estilo sa iyong dokumento. Sa naaangkop na sheet ng estilo, magdagdag ng isang hanay ng mga patakaran na hinarap ng isang tagapili ng isang katanggap-tanggap na antas ng pagiging tiyak. Sa ruleset, ipasok ang background-color na pag-aari sa parehong paraan tulad ng sa nakaraang hakbang. Piliin ang pagiging tiyak ng tagapili batay sa mga panuntunan sa cascading ng CSS2 at ang nais na saklaw. Kaya, kung kailangan mong itakda ang kulay ng isang link lamang, makatuwiran na gumamit ng isang tagapili ng ID, kung maraming mga naturang mga link, mas mahusay na gumamit ng isang tagapili ng katangian batay sa halaga ng klase.
Halimbawa, upang magtakda ng isang berdeng background para sa isang tukoy na link sa isang dokumento, maaari kang magdagdag ng isang hanay ng mga panuntunan sa sheet ng estilo:
Isang # ID_GREEN
{
background-color: # 00FF00;
}
Dapat mo ring itakda ang katangian ng ID ng isang elemento na naaayon sa nais na link sa ID_GREEN:
teksto ng link
Hakbang 3
Punan ang background ng link ng isang imahe. Sundin ang mga pamamaraang inilarawan sa mga hakbang isa at dalawa, ngunit sa halip na ang background na kulay ng CSS na pag-aari, gumamit ng background-image. Halimbawa:
teksto ng link
Kung kinakailangan, magdagdag ng isang background-ulit na pag-aari sa itinakdang mga patakaran ng CSS upang tukuyin ang mga pagpipilian para sa pagdoble ng background na imahe ng pahalang at patayo.
Hakbang 4
Gawing nagbago ang background ng link kapag nag-hover ka rito o kapag gumalaw ang pokus. Magdagdag ng mga hanay ng panuntunan sa isang panlabas o naka-embed na sheet ng istilo ng dokumento na tumutukoy sa background ng isang link o pangkat ng link sa iba't ibang mga estado. Gumamit ng mga tagapili ng ID at katangian na kasabay ng mga pabagu-bagong klase ng pseudo: hover,: aktibo, at: focus. Halimbawa
Isang # ID_DYNAMIC_BACKGROUND
{
kulay sa background: # FF0000;
}
Isang # ID_DYNAMIC_BACKGROUND: mag-hover
{
background-color: # 00FF00;
}
Maaari mong gawin ang parehong upang lumikha ng isang background na may isang pabagu-bagong pagbabago ng imahe.
