mk3mk
@mk3mk
занимаюсь вёрсткой (иногда)

Брейкпойнты в верстке?

Друзья!
Пролейте свет!
Если дан макет. В макете нарисовано три разрешения 1140 768 и 320 px.
И указано где 320 px, например значение для h1 font-size: 32px,
а там где нарисовано для разрешения 768, там значение для h1 font-size: 42px,
а для 1140 значение для h1 font-size: 52px,
то это что означает?
эти значения идут вверх или вниз от брейкпойнта?
т.е. мне надо ставить h1 font-size: 32px, от нуля и до 320 px, а после 320 px сразу идет 42 px.
Или наоборот, надо ставить 32 px от нуля до 320 px и дальше до 768 тоже 32 px, а только от 768 и выше будет 42 px, а потом после 1140 будет 52 px...
  • Вопрос задан
  • 157 просмотров
Решения вопроса 3
Kiriniy
@Kiriniy
Графический дизайнер / Веб-разработчик
32 до 768, 42 до 1140, а дальше 52.
Ответ написан
kirbi1996
@kirbi1996
Вверх идут, меньше 320 нет уже смысла верстать
Ответ написан
profesor08
@profesor08 Куратор тега CSS
@mixin mobile {
  @media (max-width: 767.98px) {
    @content;
  }
}

@mixin tablet {
  @media (min-width: 768px) and (max-width: 1139.98px) {
    @content;
  }
}

@mixin desktop {
  @media (min-width: 1140px) {
    @content;
  }
}

h1 {
  @include desktop {
    font-size: 52px
  }

  @include tablet {
    font-size: 42px
  }

  @include mobile {
    font-size: 32px
  }
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы