Faʻapefea ona Faʻaaoga le CSS Positioning e Fausia ai Taiala E aunoa ma laulau

Lisi o Ripoti Tatala Fausia New Design Frontiers

E tele mafuaʻaga e le faʻaaoga ai laulau mo le faʻatulagaga . O se tasi o mafuaʻaga masani e tuʻuina mai e tagata mo le faʻaauau ona faʻaaogaina ona o le faigata ona fai le laasaga ma le CSS. E ui lava o le tusitusi a le CSS e aofia ai se aʻoga aʻoga, pe a e malamalama pe faʻapefea ona faia le CSS layoutotogi, atonu e te maofa i le faigofie tele. Ma o le taimi lava e te aʻoaʻo ai, o le a e talanoa atu i le mafuaaga sili lona lua e mafua mai ai tagata ona o le le faaaogaina o le CSS- "E sili atu le vave ona tusia o laulau." E vave tele ona e te iloa laulau, ae a e aʻoina le CSS, atonu o oe vave ma lena.

Tautinoina o le Suiga o le CSS Positioning

O le tulaga o le CSS o loʻo lagolagosua lelei i initaneti uma . Vagana o loʻo e fausiaina se 'upega tafaʻilagi mo Netscape 4 poʻo Internet Explorer 4, e le tatau i au' au faitau ona i ai ni faʻafitauli e matamata ai i lau 'upega tafaʻilagi' Upega Fesootaiga CSS.

Toe faʻafefea pe faapefea ona e fausia se itulau

A e fausia se 'upega tafaʻilagi e faʻaaoga ai laulau, e tatau ona e mafaufau i se faatulagaga faʻapipiʻi. I se isi faaupuga, o loʻo e mafaufau i tulaga o siaki ma laina ma koluma. O au itulau Upega o le a atagia ai lenei auala. A e alu i se mamanu faatulagaina o le CSS, o le a amata ona e mafaufau i ou itulau i tulaga o le anotusi, aua o mea uma e mafai ona tuʻu i soo se mea e te manaʻo i ai i le laulau-e tusa lava pe faʻalogo i luga o isi mea.

O 'upega tafaʻilagi eseese e eseese o latou fausaga Ina ia fausia se itulau aoga, iloilo le fausaga o soʻo se itulau ua tuʻuina atu ae e te leʻi tuʻufaʻatasia mea e te mauaina. O se faʻataʻitaʻiga itulau atonu e aofia ai ni vaega se lima:

  1. Ulutala . Fale i le fuʻa faasalalauga, igoa o le 'upega tafaʻilagi, fesoʻotaʻiga vaʻavaʻa, se ulutala ulutala ma isi mea.
  2. Taumatau taumatau . O le itu taumatau lea o le itulau ma le pusa sailiili, faʻalauiloa, pusa vitio, ma nofoaga faʻatau.
  3. Initaneti . O le tusiga o se tusiga, lautusi o le blog po o le faatau faatau-o aano o manu ma-pateta o le itulau.
  4. Faasalalauga i totonu . O faasalalauga faalauiloa i totonu o mataupu.
  5. Lalo . O le lalo navigation, faʻamatalaga a le tusitala, faʻamatalaga o le puletaofia, faʻasalalau fuʻa lagoʻa, ma fesoʻotaʻiga e fesootai.

Nai lo le tuʻuina o na elemene e lima i se laulau, faʻaaoga elemene e vaevaeina HTML5 e faʻamatala ai vaega eseese o le anotusi, ona faʻaoga lea o le CSS tulaga e tuʻu ai mea o loʻo i le itulau.

Faailoaina o Au Faʻamatalaga Vaega

A maeʻa ona e faʻamatalaina vaega eseese o lau 'upega tafaʻilagi, e manaʻomia ona e tusia i totonu o lau HTML. E ui lava e mafai, i le lautele, tuʻu lau vaega i soʻo se poloaiga, o se manatu lelei le tuʻu muamua o vaega taua o lau itulau. O lenei auala o le a fesoasoani i le sueina o le afi-masini, faʻapea foi.

Ina ia faʻaalia le tuʻuina atu, mafaufau i se itulau e tolu koluma ae leai se ulu poʻo se vae. E mafai ona e faʻaogaina le tulaga e fai ai soʻo se ituaiga laiga e te fiafia i ai.

Mo se faʻatulagaga e tolu-tolu, faʻamatala ni vaega se tolu: koluma agavale, koluma taumatau, ma mea e aofia ai.

O nei vaega o le a vave faʻaaogaina e faʻaaoga ai le vaega o le ARTICLE mo le anotusi ma le lua VAEGA vili mo le lua koluma. O mea uma o le ai ai foi se uiga e iloagofie ai. A e faʻaaoga le id attribute, e tatau ona e taʻuina se igoa tulaga ese mo id taitasi.

Tuʻuina o le Faʻamatalaga

Faʻaaoga CSS, faʻamatala le tulaga mo au ID'd elemene. Teu lau faʻamatalaga i luga o se faiga e pei o lenei:

#content {

}

O totonu o nei elemene o le a sili atu le avanoa e mafai, e aofia ai le 100 pasene o le lautele o le nofoaga o iai nei poʻo le itulau. Ina ia aafia ai le tulaga o se vaega e aunoa ma le faamalosia i se lautele, ia suia le taʻavale poʻo le pito i lalo.

Mo lenei laasaga, ia seti laina e lua ile lautele lautele ona seti loa lea o le latou tulaga, ina ia latou le aafia i mea e maua ai i le HTML.

# agavale agavale {
tulaga: faʻamaoni;
tauagavale: 0;
lautele: 150px;
tafatafa-tauagavale: 10px;
pito i luga: 20px;
lanu: # 000000;
paʻu: 3px;
}
# taumatau #
tulaga: faʻamaoni;
tauagavale: 80%;
luga: 20px;
lautele: 140px;
paʻuvale-tauagavale: 10px;
z-index: 3;
lanu: # 000000;
paʻu: 3px;
}

Ona mo le vaega o loʻo i ai, ia faatulaga laina i le itu taumatau ma le tauagavale ina ia le mafai e le mea o loʻo i luga ona tuʻuina atu pito i fafo.

#content {
luga: 0px;
tuaoi: 0px 25% 0 165px;
paʻu: 3px;
lanu: # 000000;
}

O le faʻamalamalamaina o lau itulau e faʻaaoga ai le CSS ae le o se laulau HTML e manaʻomia ai se poto faʻapitoa faʻapitoa, ae o le totogi e mulimulitaʻia mai fetuutuunaiga sili atu ona faigofie ma fetaui lelei ma sili atu le faigofie i le faia o suiga fetuunai i lau itulau mulimuli ane.