2016-09-01 3 views
0

Я запутался об этой части кода в исходный код начальной загрузки 3.3.5 О системе Bootstrap Сетка

/*line 1585 - 1590*/ 
.container { 
    padding-right: 15px; 
    padding-left: 15px; 
} 
/* line 1612 - 1615*/ 
.row { 
    margin-right: -15px; 
    margin-left: -15px; 
} 

, что они используются?
-------------------------------
Спасибо, ребята!
Это мое мнение после прочтения ваших ответов:
1.Добавить дополнение к контейнеру делает содержимое .контейнера подальше от boudary;
2.Но это означает, что первый/последний столбец - 2 прокладки от границы, не так приятно. Поэтому добавьте отрицательный запас, чтобы разложить его до границы.
Я прав?
Кстати, я задал этот вопрос, потому что я не вижу разницы, удаляю ли я эти два правила или нет.

+0

Почему вы спрашиваете? Вы читали документацию Bootstrap? Http: // getbootstrap.com/css/# grid – Lee

+1

Документация по Bootstrap достаточно, чтобы научить вас, если вы будете учиться. и если они не хотят, чтобы эти дополнения использовали их или записывали собственные классы, css – mean

ответ

1

Как правило, в контейнерах, как указано, добавляются отступы слева и справа, чтобы контент не попадал прямо к краю экрана, что делает его пригодным для использования в мобильных телефонах и его легче читать.

При использовании столбцов это добавляет отступы влево и вправо, которые могут отображаться «вне выравнивания» по отношению к остальной части содержимого, поэтому вы можете обернуть их в строку, используя отрицательные поля, чтобы вернуть это дополнение в соответствие с остальная часть контента.

Опять же, это должно сделать его более выровненным и чистым.

Из Bootstrap документации (http://getbootstrap.com/css/#grid):

Строки должны быть размещены в пределах .container (фиксированной ширины) или .container-жидкости (полной ширины) для правильного выравнивания и заполнения.

Использование строк для создания горизонтальных групп столбцов.

Содержимое должно быть размещено в столбцах , и только столбцы могут быть непосредственными дочерними элементами строк.

+0

Спасибо! 1. Добавлять дополнение к контейнеру делает содержимое .контейнера подальше от boudary; 2. Но это означает, что первый/последний столбец - это 2 прокладки от границы, не так приятно. Поэтому добавьте отрицательный запас, чтобы разложить его до границы. Я прав? Кстати, я задал этот вопрос, потому что я не вижу разницы, удаляю ли я эти два правила или нет. – Rubicker

+0

Так что да, в принципе, правильно, если у вас есть два столбца внутри '.container', они будут иметь 15px-padding слева и справа от столбцов. Обтекание этих двух столбцов внутри '.row' будет подталкивать эти столбцы к абсолютным границам' .container' div, что делает их снова хорошими. – Lee

1

Строки всегда должны размещаться внутри контейнера для обеспечения правильного расстояния между содержимым страницы и краем браузера. Если вы не помещаете строку внутри контейнера, строка будет больше ширины окна просмотра, вызывая горизонтальную полосу прокрутки.

В строке Bootstrap используются отрицательные поля для противодействия заполнению контейнера. Конечным результатом не является визуальный интервал (margin или padding) по сторонам строки внутри контейнера. Это важно для гибких конструкций, чтобы обеспечить равномерный интервал, поскольку столбцы могут обертываться или складываться вертикально (изменяя количество столбцов, отображаемых в каждой строке).

Также смотрите:
Bootstrap 3 Rows and Columns
How the Bootstrap grid works

0

Bootstrap столбцы имеют 15px левый и правый отступы так, что их содержание правильно разнесены. Однако это подталкивает содержимое первого и последнего столбцов 15px от родителя. Чтобы компенсировать, строка имеет отрицательные поля слева и справа 15px. Вот почему вы всегда должны размещать столбцы в строках.

Смежные вопросы