Fundacja Korektor (Equalizer)
Możemy dodać element kontenera data-equalizer
właściwość i dodać do każdego podelementu data-equalizer-watch
własności stworzyć identyczną wysokość korektora. Najwyższym elementem określa wysokość pozostałych elementów.
Uwaga: Suwak wymaga JavaScript. Więc trzeba zainicjować OUNDATION JS:
Przykłady
< "Medium-4 div class = panel kolumny" data-korektor-watch>
Lorem ipsum pl.
</ Div>
< "Medium-4 div class = panel kolumny" data-korektor-watch>
Sed ut pl.
</ Div>
< "Medium-4 div class = panel kolumny" data-korektor-watch>
Lorem ipsum pl.
</ Div>
</ Div>
<! - Inicjowanie Fundacja JS ->
<Script>
$ (Document) .ready (function () {
$ (Document) .foundation ();
})
</ Script>
Spróbuj »
Korektor różne ekrany
Na wyrównanie dodając data-equalizer-mq=" value "
mq atrybut ustawiony na tej samej wysokości dla różnych rozmiarów ekranu. Wartość ta może być jednym z następujących:
wartość | opis | Przykłady |
---|---|---|
medium-up | Domyślnie. Tworzenie taką samą wysokość kontenera, szerokość większą niż 40.063em | |
large-up | Tworzenie taką samą wysokość kontenera, szerokość większą niż 64.063em | próbować |
xlarge-up | Tworzenie taką samą wysokość kontenera, szerokość większą niż 90.063em | próbować |
xxlarge-up | Tworzenie taką samą wysokość kontenera, szerokość większą niż 120.063em | próbować |
zawartość zagnieżdżona
data-equalizer
i data-equalizer-watch
dodać taką samą wartość nieruchomości. Może to być połączone z pojemnikiem korektora. Wielokrotnie zagnieżdżony korektora, upewnij się, że są mecze:
Przykłady
<div class = "wiersz" Dane -equalizer = "pierwszy">
<div class = "średnio-4 kolumny">
<Div class = "Panel" Dane -equalizer-watch = "pierwszy">
<H3> Panel </ h3>
<! - Zrównanym Pojemnik Wewnątrz Równa Container ->
<div class = "wiersz" Dane -equalizer = "drugi">
<Div class = "Panel" Dane -equalizer-watch = "drugi">
<H3> zagnieżdżonych panelu </ h3 >
<P> Lorem ipsum pl. </ p>
</ Div>
<Div class = "Panel" Dane -equalizer-watch = "drugi">
<H3> zagnieżdżonych panelu </ h3 >
<P> Lorem ipsum pl. </ p>
</ Div>
<Div class = "Panel" Dane -equalizer-watch = "drugi">
<H3> zagnieżdżonych panelu </ h3 >
<P> Lorem ipsum pl. </ p>
</ Div>
</ Div>
<! - Koniec Zagnieżdżony Równa Container - >
</ Div>
</ Div>
<div class = "średnio-4 kolumny">
<Div class = "Panel" Dane -equalizer-watch = "pierwszy">
<H3> Panel </ h3>
<P> Ut enim pl. </ p>
</ Div>
</ Div>
<div class = "średnio-4 kolumny">
<Div class = "Panel" Dane -equalizer-watch = "pierwszy">
<H3> Panel </ h3>
<P> Lorem ipsum plpl </ p>
</ Div>
</ Div>
</ Div>
Spróbuj »