/ / Hogyan társítsd a felső sávot és a fülbubót az Alapítvány 5-ben? - zurb alapítvány

Hogyan kombinálhatjuk a felső sávot és a füleket az Alapítvány 5-ben? - zurb alapítvány

Lehetséges kombinálni legjobb bár és fül-bar (Off-vászon)?

Ez: itt írja be a kép leírását

Ez lesz a mobilméret átméretezéskor:

itt írja be a kép leírását

De azt is szeretném felvenni ott a tab-bar (off vászon), így válik így

itt írja be a kép leírását

Nem tudtam elképzelni, hogyan lehet ezt tenni, és énmegpróbálta elkészíteni az egyéni menüikonomat, és behelyezni a felső sávba, de problémám volt a pozícionálással, az elemek eltűntek, a margó / párnázás nem működött, a helyzet viszonylagosan elrontotta a stílusomat. jobb ötleted van.

válaszok:

3 a válasz № 1

2 módon teheti meg, először a média lekérdezések vagy a másik a láthatósági osztály használata. Például a felsődobozban adjon hozzá class = "show-for-medium-up" -t, amely a felső sávot közepes képernyőn és felfelé teszi, de kis méretben elrejti.

<nav class="top-bar show-for-medium-up" data-topbar>
<ul class="title-area">
<li class="name">
<h1><a href="#">My Site</a></h1>
</li>
<li class="toggle-topbar menu-icon"><a href="#">Menu</a></li>
</ul>

<section class="top-bar-section">
<!-- Right Nav Section -->
<ul class="right">
<li class="active"><a href="#">Right Button Active</a></li>
<li class="has-dropdown">........................

Ezután adja hozzá az offcanvas kódját, és add class = "hide-for-medium-up"

<div class="off-canvas-wrap hide-for-medium-up">
<div class="inner-wrap">
<nav class="tab-bar">
<section class="left-small">
<a class="left-off-canvas-toggle menu-icon" ><span></span></a>
</section>

<section class="middle tab-bar-section">
<h1 class="title">Foundation</h1>

Ezzel a képernyő méretétől függően különböző stílusokat tud végrehajtani. További információért nézd meg a láthatósági osztály


Kapcsolódó kérdések


Hozzászólások (0)

Hozzászólni