Hogyan hozzunk létre egy menüt a css stack túlcsorduláshoz oroszul

Kétféleképpen lehet egymás után két elemet felépíteni:

kijelző: inline; De valójában jobb megjelenítés: inline-block; akkor megkapja az elem szükséges "vonalát", de a blokád bizonyos tulajdonságait is: a szélesség, a lapok stb.

úszó: balra; Normál áramlás. Így szeretek többet. Minden áramvonalas elem blokkolóvá válik. A blokkelemek között nincs szóköz. Legalábbis erre alkalmasabbnak találom. De az áramlásnak több tulajdonsága van. Például, hogy az áramlást le kell dobni. Ezt az ingatlan törli: mindkettő; (jobb és bal és jobb oldali csomagolás). Az ezzel a tulajdonsággal rendelkező címke az utolsó egyszerűsített elem után folytatódik. Annak érdekében, hogy a HTML-kódot ne töltsük be extra címkékkel, javasoljuk, hogy hozzon létre egy clearfix osztályt a kódhoz (lásd a kódot), és egyszerűen add hozzá a szülőcsomag címkéjéhez. A pszeudoosztályok előtti és utáni használatával a szükséges elemek hozzáadásra kerülnek az adatfolyam-alaphelyzetbe állítással.

Az első és az utolsó elemet egyáltalán nem kell egyesíteni a html-ben. Használhatja a CSS pseudo-osztályokat:

A sarkok kerekítéséhez próbálkozzon a határ-sugár tulajdonság használatával.

A li elemekhez adj hozzá 20% szélességet.

Az elemeken belüli linkek blokkolva vannak (display: block), hogy az elem teljes szélességét elfoglalhassák.

2) Azt javaslom, hogy a navigációs menüben használja az ul / li gombot. A művelet menüben pedig használja a menüt / li. A navigációs menü a .nav vagy .navigation osztály megjelenítésére van beállítva.

3) Ha több összetevőt, például li-et szétszór, az img tartalmával, akkor mindent alkalmazzon a jelölésre, például a margóra vagy a méretekre, li-ra.

4) A háttér elveszett, mert nem mentesítette az áramlást. Add hozzá a clearfix osztályt a menü összetevők csomagolási címkéjéhez.

5) Ha a menüt, amit dobott, majd dobja a háttérben, akkor is hozzá ezt a törlést.

6) És logika a kódban. Írjon szelektort egymás után a szemantikai rend szerint.

Kapcsolódó cikkek