Menu CSS tūsaʻo: faia e oe lava ia

O nisi e le mananao webmasters e faaalu se taimi le atiina ae o mai valu elemene faigofie ua leva ona i ai. Latou te talitonu e leai se taimi i maimau lou taimi i se mea ua leva ona i ai. O le mea moni, mo i latou oe ua na pulea HTML ma CSS, e taua ai ia te oe lava le tele o mea ina ia maua se malamalamaaga lelei o la latou galuega. O lenei e faatatau i le meaai. Fai se meaai tūsaʻo CSS. O le a faavae i luga o na o HTML ma CSS, e aunoa ma le faaaogaina o Javascript ma JQuery. Taitasi menu o se lisi o sootaga e tau atu i itulau o le saite.

laasaga faavae

E fatu ai se faigofie menu tūsaʻo CSS, e manaomia le laasaga nei:

1. Muamua, fuafuaina se lisi o sootaga (faaaoga code HTML), o lea o le a avea ma meaai. Tuu atu i ai se igoa, mo se faataitaiga, ua taua e faapea:

1. Aiga.
2. Lo tatou talafaasolopito.
3. Taiala.
4. Auaunaga.
5. Fesootaiga.

2. Ona Styling sootaga e pei e te manao i le fesoasoani a CSS.

Tatou tusi le code HTML, tausia i my_Vmenu.html faila ma vaai pe o le a vaai i le browser:

o le faavae lenei (auivi) o le tatou meaai. # 1, # 2, ma isi e tatau ona suia i faasinomaga. Tagai i le auala e foliga mai i se browser. O le ata o le a outou le fiafia. O lenei e tatau ona tatou amata e faamatala ai le vaega o faiga, e faia ai se meaai tūsaʻo CSS atoatoa.

ituaiga faamatalaga

Fai se faila my_Vmenu.css, lea e faatulaga mea uma e te manao e faaleleia atili ai le foliga mai o ia o se elemene taua o le saite. o le code iinei, o le faatomuaga o lea o le a toe faafouina le meaai tūsaʻo CSS. E ma tusi le faila fou, ma o le a tatou ave a latalata vaai le uiga o le laina autu e tuuina mai.

Faamatalaga auiliili faaaogaina stylesheet

O lenei mafaufau i faamatalaga auiliili o lo tatou menu tūsaʻo CSS:

lisi-o faiga-ituaiga e mafai ai ona e aveesea ai le lisi o faailoga. E ala i le "0" i le laina ma padding aveesea le padding faaopoopo i le lisi. A o mafai ona vaaia mai le code HTML, o lo tatou menu o se lisi, ma le ituaiga o loo faamatalaina i le faaaogaina o CSS.

ul # my_Vmenu - le faiga atoa o le lisi atoa.

ul # my_Vmenu Li a - faiga sootaga i le va o le Li pine.

ul # my_Vmenu a Li: TAPĒINA - o se faamatalaga o le ituaiga i lalo o le iloiloina o menu mea i se taimi hovers se tasi i luga o tagata.

ul # my_Vmenu Li a aga - faamatalaga mau (Igoa menu).

Ia manatua o le faatoai my_Vmenu.css my_Vmenu.html ma e tatau ona teuina i le tusi lava lea e tasi. Peitai, e mafai ona maua i latou i folders eseese, ae o lea e taua ai le faamauina i le ala faila my_Vmenu.html e my_Vmenu.css. Ia faaeteete, aua e masani le newcomers i lenei faafitauli.

e tatau ona fesootai faiga le va o le pine o le ulu i se HTML-faila. menu_1.png ma menu_2.png - o le ata mo le mea menu ata lenei i le tulaga masani ma TAPĒINA.

E sili e faasaoina ai le ata i se faila e ese ai mo tupua, faaigoa ai my_images, ae Fetuunai le code CSS. Tusi mea o loo faaalia i nei ata, latou i ai i lenei tusitaiala: URL (my_images / menu_1.png) ma URL (my_images / menu_2.png).

I le isi vaega o le meatotino o loo faamatalaina i le code CSS, ia malamalama faigofie. Latou faauigaina le faaali mai o lo tatou meaai. E faigofie lava ona matauina o le lautele ma le maualuga o mea ua faamaoti mai mo le mea lava lea e tasi i le tulaga masani, ma a outou TAPĒINA le isumu i latou. Vai tele 18px, padding faamaoti mai e le indentation mai eseese itu o le igoa o nofoaga. faaaliga faatagaina e faatuina le faaaliga iunite e faatulaga le lautele ma padding.

Tatou menu tūsaʻo

A e mafai ona e iloa, o le meaai tūsaʻo CSS e fatu faigofie. I luga o le faavae o faamatalaga o le malamalama o le a mafai ona e faia e matagofie ma tosina atu i tagata asiasi i lou tuatusi faakomepiuta! Faaaoga lou mafaufau, ona a stylish menu e faaatoatoa ai o outou nofoaga.