Etsa menyetla e tsitsitseng ea setša u le mong

Menyu e holimo e batla e le sebakeng sefe kapa sefe sa marang-e leng karolo ea bohlokoa, hobane e khona ho khahla kapa, ho fapana le hoo, e tšosang baeti ho bonahalang le ho ba bonolo. A re ithute ho theha menyetla ea mathomo ea motheo: re tla e etsa "skeleton" ho HTML, re tla tseba tsebo ea motheo ea pōpo. Ka sebele u ka fumana menu e entsoeng e lokiselitsoe, empa ho thabisa haholo ho ithuta ho e ntlafatsa. Ena ke mosebetsi o thabisang haholo.

Ho ithuta ho etsa menu

Re tla leka ho se khelohe ho semantics, e khomarelang coryphaeus ea mohaho. Ntlha ea pele re lokela ho etsa "masapo" bakeng sa menu ea rona ka HTML, ho tseba litsebo tsa mantlha e le ho ithaopela ho etsa menu e holimo. Ebe o khabisa ka ho sebelisa li-sheets. Etsa hore menu ea rona e holimo e be le lintho tse 5. Ntho ea pele e tla fetisetsoa leqepheng le ka sehloohong. Ntho ea bobeli ke "About Us". Ea boraro ke Award ea rona. Ntlha ea bone - "Hoa thahasellisa." Ea bohlano ke "Iteanye le rona".

Khoutu ya HTML e shebahala tjena:

Ke mang ea sa tsebeng: tag ea ul e sebelisetsoa lethathamong la lihlopha, litho tsa eona li qala ka li. Li tag li rua mekhoa e sebetsang ho ul.

Ul ke karolo e kholo ea lenane lena, e tla otlolla ho bophara ba leqephe. Li e boetse e thiba.

Kahoo, bopa index.html. Re letsetsa khoutu ea rona. Ka nako ena, sebapali se tla bontša menu ea mahlo, eseng e sa hokae. Empa re na le sepheo - ho etsa menyetla e holimo ea sebaka sena. Bakeng sa sena re hloka CSS.

Ke hobane'ng ha CSS?

Haeba o sa ntsane o tseba hantle ntshetsopele ea di-site, joale o lokela ho tseba mohopolo oa li-sheets. Ha e le hantle, tsena ke melao ea ho etsa moralo, ho sebetsa, e sebetsang likarolong tse sa tšoaneng maqepheng a websaeteng ena. Haeba o hlalosa litšobotsi tsa lisebelisoa ka HTML e tloaelehileng, joale o tlameha ho pheta sena khafetsa, o tla pheta likaroloana tsa khoutu tse tšoanang. Nako eo leqephe leo le tsamaeang ka eona khomphuteng ea mochine e tla hōla. Ho qoba sena, ho na le CSS. Ho lekane ho hlalosa ntho e itseng feela ka nako e 'ngoe, ebe u bolela feela moo u ka sebelisang thepa ea mokhoa o itseng. U ka hlalosa tlhaloso ea leqephe feela, empa hape le faele e 'ngoe. Sena se tla u lumella hore u sebelise tlhaloso ea mekhoa e fapaneng leqepheng leha e le lefe la sebaka sena. Ho boetse ho loketse ho fetola maqephe a mangata ka ho lokisa faele ea CSS. Lipampiri tsa maqephe li u lumella hore u sebetse le fontsane ka mokhoa o molemo ho feta HTML, u thusa ho qoba maqephe a boima haholo a sebaka sena ka lipapali.

Ho sebelisa maqephe a mokhoa oa ho ntlafatsa menyetla

CSS bakeng sa menu:

1. # My_menu {list-setaele: ha ho letho; Pale: 6; Bophara: 800px; Margin: koloi;}
2. # My_1menu li {float: ka ho le letšehali; Tlhahiso: italic 18px Arial;}
3. # My_1menu ka {mmala: # 756; Hlahisa: thibela; Boima: 55px; Boima ba mela: 55px; Padding: 0px 15px 0px 15px; Ka morao: #dfc; Mongolo-mokhabiso: ha ho letho;}
4. # My_1menu ho: hover {mmala: #foa; Ka morao: # 788;}

Joale a re ke re hlahlobe menu e hlahisang CSS e holimo.

# My_1menu - ena ke mokhoa oo mokhoa oa UL o fanoang ka oona oa UL ka id = my_1menu, lethathamo-mokhoa: ha ho na taelo ea ho tlosa letšoao ka letsohong le letšehali la lintlha.

Bophara: 800px - bophara ba menu ea rona ke 800 pixels.

Padding: 0 - sena se tlosa indents ka hare.

Margin: ho lumellana ha molomo oa menu e hokahaneng bohareng ba leqephe la rona.

# Mekhoa ea ka ea metsing ea li-lenu li-li-element.

Boima: 55px - bolelele ba menu.

# My_1menu ho: hover - fa melaetsa ho e-element ha mouse e hovered ka eona.

Re ke ke ra hlalosa mohlo ka mong ka ho qaqileng, kaha moqapi e mong le e mong a ka beha maemo a hae mona. Ena ke motheo oa ho sebelisa mekhoa ho menu ea sebaka. U ka e fa ponahalo e feletseng le e ntle ka ho sebelisa litšoantšo. Fana ka ntlha e, ka mohlala, mokokotlo: url (img1.png) pheta-x. A re ba le mokokotlo: url (img2.png) pheta-x bakeng sa: hover.

Sebelisa monahano oa hau, lithahasello tsa pōpo. Joale, ho itšetlehile ka tsebo ea hore na u ka etsa joang menu e bonolo ka ho fetisisa setšeng, u ka hlahisa maqephe ka moqapi oa bona o ikhethang.