Сетка Фонд - Medium оборудование
В последней главе мы ввели небольшие устройства , мы используем .small-* класс для установки коэффициента сетки на 25% / 75%:
<div class="small-3 columns">....</div> <div class="small-9 columns">....</div>
На средних устройство, которое мы рекомендуем соотношение 50% / 50%.
Совет: Размер экрана определяется в среднего оборудования 40.0625em к 64.0624em между ними.
Среднего размера оборудование .medium-* категория.
Теперь мы добавим два на СЧ устройства:
<div class="small-3 medium-6 columns">....</div> <div class="small-9 medium-6 columns">....</div>
? В случае, установить две колонки, соотношение составляло 25% и 75% (Фонд мобильного первая: Если не указано, большое оборудование наследует .Small код класса):
Доля малых устройств% 25/75% ( .small-3 и .small-9 ). Тем не менее, удельный вес оборудования среднего размера , используемого было% 50/50% ( .medium-6 и .medium-6 ).
примеров
<Div класс = "малого 3 среднего 6 колонн" стиль = "цвет фона: желтый;">
<P> В этом учебнике </ p>
</ Div>
<Div класс = "малого 9 среднего 6 колонок" стиль = "цвет фона: розовый;">
<P> В этом учебнике </ p>
</ Div>
</ Div>
Попробуйте »
 | Примечание: Для того, чтобы убедиться , что число столбцов добавить до 12! |
|---|
Tight устройство для использования на средних
В следующем примере мы указываем .medium-6 класс (не .small-* ). Это указывает на то, что в средней или большим отношением оборудования 50% / 50%. Но на небольшом устройстве горизонтально расставленных (ширина 100%):
примеров
<Класс = Див "среднего 6 столбцов" стиль = "цвет фона: желтый;">
<P> В этом учебнике </ p>
</ Div>
<Класс = Див "среднего 6 столбцов" стиль = "цвет фона: розовый;">
<P> В этом учебнике </ p>
</ Div>
</ Div>
Попробуйте »