Почему Bootstrap 4 выбирает rem и em вместо px?

Я хотел бы знать, почему Boostrap выбрать rem и em вместо px новая версия Boostrap 4.

можно посмотреть здесь

примеры некоторых переменных:

    $font-size-h1: 2.5rem !default;
    $font-size-h2: 2rem !default;
    $font-size-h3: 1.75rem !default;
    $mark-padding: .2em !default;

Это хорошая практика использовать em и rem для:

  margin: 0;
  padding: 0;
  bottom: 0px;
  width: 100%;

мне просто интересно, что я не мог найти в интернете об этом, поэтому я спрашиваю.

17
css em html sass twitter-bootstrap

2 ответов

С rem, все размеры шрифта относительно корневого элемента (ака, тег HTML.) Причина этого заключается в том, чтобы упростить масштабирование вверх или вниз для устройств. Вы можете технически изменить HTML-тег на меньший или больший размер, чтобы масштабировать все размеры шрифта одинаково – что очень хорошая функция.

... [T]он главное, чтобы забрать-это все динамично и относительно корневого тега HTML.

например, измените размер шрифта HTML css на разное количество. .. и посмотрите, как вся сетка настраивается и масштабируется.

источник: скотч.io

17

стоит отметить, что Bootstrap 4 сохранил точки останова в px, а не em. От docs:

в то время как Bootstrap использует ems или rems для определения большинства размеров, pxs используются для точек останова сетки и ширины контейнера. Это связано с тем, что ширина окна просмотра находится в пикселях и не изменяется с размером шрифта.

4