nata_name 22 ноя 2019 в 06:47

Изучить отзывчивый веб-дизайн за 5 минут

4 мин

26K

CSS * HTML * Веб-дизайн *

Из песочницы

+17

Комментарии 5

ArcticFox777 22 ноя 2019 в 17:06

Интересно. На youtube много видео на подобную тему, длительностью от 40 минут. А тут все в статью уложилось.

hd_keeper 22 ноя 2019 в 21:05

много облегчает

Машинный перевод detected.

mSnus 22 ноя 2019 в 23:55

Для удобства песочничества закинул сюда:
https://codepen.io/mSnus/pen/ExxJexP

Вообще не очень понял в чём смысл сначала задавать шрифт в rem, а потом через Media Query фиксировать его в px. Разве что для примера, что "так тоже можно"?

rgyph 23 ноя 2019 в 15:28

Размер шрифта элементов nav и h1 не изменяется. Изменяется он только для html, чей размер является базовым для всех вложенных элементов с rem.

То есть, итоговый медиа-запрос будет выглядеть примерно так:

@media (max-width: 768px) {
    html {
        font-size: 14px;
    }

    .myImage {
        width: 100%;
    } 
}

mSnus 23 ноя 2019 в 16:20

Вы правы, я при сборке кусков css из текста статьи по ошибке закинул туда то, что шло как "неудачный пример".

Один из способов это сделать – уменьшить размер шрифта в медиа-запросе, например, следующим образом...

Зарегистрируйтесь на Хабре, чтобы оставить комментарий