Najlepszy samouczek Fundacja Grids - duży sprzęt W 2024 r. W tym samouczku możesz dowiedzieć się Tight stosowania na dużych urządzeń,
W ostatnim rozdziale wprowadziliśmy część średnich i małych urządzeń układu urządzenia do sieci, drobnego sprzętu do 25% / 75% (.small-3 i .small-9), ale część sprzętu dla średnich 50% / 50% (.medium-6 i .medium-6):
<div class="small-3 medium-6 columns">plpl</div> <div class="small-9 medium-6 columns">plpl</div>
Na urządzeń na dużą skalę, zalecamy stosunku 33% / 66%.
Wskazówka: Rozmiar ekranu jest większa niż definicja urządzeń dużej 64.0625em.
Zastosowanie dużych urządzeń .large-*
kategorii.
Teraz dodamy dwa na dużą skalę urządzeń:
<div class="small-3 medium-6 large-4 columns">plpl</div> <div class="small-9 medium-6 large-8 columns">plpl</div>
.small-3
i .small-9
) .medium-6
i .medium-6
) .large-4
i .large-8
) Uwaga: Aby upewnić się, że liczba kolumn sumują się do 12! |
Poniższy przykład, możemy określić .large-6
klasy (a nie .medium- * .small-*
). Oznacza to, że duża część sprzętu jest 50% / 50%. Ale w średnich i małych urządzenia poziomo ułożone (szerokość 100%):