Meniul vertical cu submeniul drop-down pe css

Meniul vertical cu submeniul drop-down

Un alt tip obișnuit de meniu este meniul cu submeniuri derulante. De obicei, există numai două nivele în astfel de meniuri, dar există, de asemenea, mai multe niveluri, când unul dintre submeniurile drop-down poate să scadă altul și așa mai departe.







Structura acestor meniuri este simplă - o listă obișnuită pe mai multe niveluri. Când creați un astfel de meniu, trebuie să utilizați poziționarea absolută și relativă.

În mod obișnuit, elementele din lista de nivel superior li sunt date poziționarea relativă, iar pentru meniul drop-down, absolută.

Va arăta așa.

Poziția proprietății CSS specifică modul de poziționare a elementelor. Valoarea implicită este statică. ceea ce înseamnă "poziționare normală".







Mijloace relative "poziționare relativă". Elementul relativ poziționat poate fi mutat în raport cu poziția inițială.

Valoarea absolută a proprietății poziției stabilește elementul la poziționarea absolută.

Elementele poziționate în mod absolut au următoarele caracteristici:

  • Renunțați la fluxul de documente. Locul ocupat devine gol și ocupat de elemente vecine.
  • Lățimea implicită depinde de conținut (și nu se întinde pe întreaga lățime disponibilă).
  • Ei rămân în același loc dacă nu s-au stabilit proprietățile de vârf. la stânga. dreapta. de jos.

    Acum să mergem la afaceri.

    Mai întâi, creați un șablon pentru meniul nostru viitor.

    Acum, eliminați indicele și marcatorii interiori și exteriori.

    Ne vom pretuși meniul.

    Acum ne vom ocupa de sub-elementele pop-up.

    În principiu, meniul este gata, din motive de atractivitate adăugăm triunghiuri care arată că elementul din meniu are sub-elemente.

    Meniul nostru este gata să îl folosească pe site-ul dvs.







    Articole similare

    Trimiteți-le prietenilor: