• Страница 1 из 1
  • 1
Форум » Web-Раздел » Начинающему вебмастеру » Как правильно использовать box-sizing в CSS (Как нужно правильно использовать свойство box-sizing)
Как правильно использовать box-sizing в CSS
Kosten
Дата: Воскресенье, 2019-02-10, 22:12 | Сообщение 1
Администраторы
Сообщений:20773
Награды: 56


В этой статье разберем одно свойство box-sizing и как его можно задействовать на интернет ресурсе или тематическом блоге. Одним из свойств, которое запланировано для решения проблемы веб-дизайна, является свойство box-sizing, которое позволяет нам изменять блочную модель и настраивать ее в соответствии с нашими потребностями.

Ранее мы применяли размер рамки ко всем элементам сети с помощью универсального селектора * следующим образом:

Код
* {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
}


При этом нам удалось получить все элементы нашего сайта, чтобы иметь свойство border-box, и этот способ это хорошо, но он не самый лучший. Когда мы работаем с более крупными проектами, то целесообразно сделать это следующим образом.

Код
html {
    box-sizing: border-box;
}
*, *:before, *:after {
    box-sizing: inherit;
}


Чтобы вы могли понять, почему эта практика лучше, чем использование универсального селектора *. Так как ранее упоминалось, если мы работаем с более крупными проектами, более вероятно, что вы добавите новые модули в качестве плагинов, у этих плагинов есть свои собственные стили CSS, и если любой из них предназначен для работы, у box-sizing нас будет проблема потому что мы установили размер коробки: border-box; будет применяться ко всем элементам.

Эта практика эффективна, где было бы лучше если бы вы использовали ее во всех проектах, если только работаете в небольших проектах, то более вероятно, что вы не будете ее использовать.
Страна: (RU)
Форум » Web-Раздел » Начинающему вебмастеру » Как правильно использовать box-sizing в CSS (Как нужно правильно использовать свойство box-sizing)
  • Страница 1 из 1
  • 1
Поиск: