Arvutid, Tarkvara
Kuidas teha rippmenüüst CSS menüüsid
Täna me kaalume küsimus "Kuidas luua rippmenüüst CSS menüüsid?". Tuleb öelda kohe, et see toode tehakse ilma ühendamisel lisavahendeid. See tähendab, et menüü luuakse ainult CSS ja HTML.
koolitus
Et täielikult mõista, milline on see artikkel, sa pead natuke tutvuda teoreetilise materjali. Aga kui te olete tuttav pseudo-klassi, võite selle lõigu. Niisiis, luua vertikaalne rippmenüüst CSS menüüsid, peame element nagu «: hover». Pseudo «: hover» saab määrata igale HTML tag. See võimaldab teil määratleda hetk, kui toode Hover hiirt. Näiteks oleme määratud vara: «a: hover {color: red;}». See sisestus tähendab, et kui sa viid hiire selgub punane sisu silt . Väärib märkimist, et see pseudo-element on ka inaktiveeritud. Muide, «: hover» on seotud sarnased elemendid. Aga selle loome pseudo CSS rippmenüüst.
juhendamine
Esiteks, ärgem aru, mida on rippmenüüst. Selle definitsiooni kohaselt saab palju erinevaid meetodeid ehitamise erinevaid paigutusi. Sel juhul me analüüsime struktuur, mis koosneb mitmest pidevalt nähtavad üksused ja mitmed täiendavad (peidetud). Lõpetame koos teooria ja hakata harjutama.
- Loome paigutus meie menüüs. Selleks, HTML-koodi märgistamise. Loo pesastatud nimekiri:
-
- < / ul>. Midagi sellist peaks välja nägema oma rippmenüüst. CSS sekkuda hiljem. Sel juhul põhinimekirjas koosneb kolmest peamisest ja kaks suletud.
- Peida alammenüü. Selleks kasutame me laaditabeli, määrake järgmised omadused: ul ul {display: none;} See eemaldab elemente teise nimekirja ekraanilt.
- Loo menüü CSS, rippmenüüst põhiloendist. CSS stiili lehed kirjutavad järgmist reeglit: ul li: tiirutama ul {display: block;}. See sisestus tähendab, et kui hiir on element li, mis asub ul nimekirja ekraanile ilmub ul (lisatud). Esmapilgul selline skeem võib tunduda keeruline ja segane. Aga tegelikult on kõik väga lihtne.
- Kasutage seda paigutus end sisestades silte
- sisu. Teil on võimalik muuta mitmeid nimekirja elemente.
dekoratiivsed muudatused
Niipea kui peamenüü paigutus on valmis, saate jätkata registreerimist. Ilmselt paljud esiteks valmis vabaneda viitavate markerite nimekirja objekt. Seda saab teha kasutades ühte vara CSS, nimelt list-style-type. Sa pead lisada järgmine kanne: li {list-style-type: none;}. Siis saate sisestada raami ja teha taustal. Piir ja tausta aitavad teid. Võibolla mõned ei meeldi rippmenüüst kuvatakse lisanimekirja, lükates samal põhielemendid. Selle parandamiseks saate paigutage see. Selleks kaskaadlaadistikke kirjutada järgmine kanne: ul ul {asukoht: absoluutne; Vasakult: 15px; paremal: 15px; top: 15px; bottom: 15px;}. Muidugi, väärtused, mida kasutate oma. Sõltuvalt sellest, kus sa tahad näha rippmenüüdega, CSS pakuvad palju rohkem funktsioone, mida saab lisada erinevaid efekte ja kaunistada meie nimekirju.
järeldus
Taas tasub märkida ehitamiseks menüü paigutus. Et määrata CSS reeglid sel juhul kasutatakse varjatud väärtuse, näiteks ul ul. Kui olete dokumendi täita muu sarnane, võib esineda suuri probleeme. Sellistes olukordades, teil on vaja kasutada konkreetsel eesmärgil, näiteks lülitid või ID-IDd. Ülaltoodud artikli kujundus rippmenüüst eesmärk on tutvustada laiemale disain. Ülejäänud töö toetub oma õlgadele.
Similar articles
Trending Now