Еще одно значение свойств CSS, которое, во первых используется довольно часто, во вторых оно используется для многих элементов по умолчанию. Т.е. если вы не указали значение для какого-то стиля CSS напрямую, то чаще всего, по умолчанию, он будет иметь значение auto.
Что значит это значение?
Я подготовил небольшой пример, на котором можно посмотреть, как это работает.
<p style="width:auto; border:1px solid #ccc;">Абзац</p>
auto - происходит от слова "автоматический".
Это значит, что браузер автоматически будет на каких-то своих определенных алгоритмах, которые в него заложены, определять значение свойства.
Например, свойство width, которое отвечает за ширину элемента, по умолчанию, имеет значение свойства CSS width - auto. В примере, это свойство и значение просто продублированы.
Также с помощью свойства border для абзаца добавлена рамка границ, чтобы они были наглядно видны.
Если открыть панель разработчика браузера и перейти в режим Computed (см. видео) и начать уменьшать размеры области просмотра браузера, мы с вами увидим, как браузер автоматически пересчитывает значение свойства width для выбранного абзаца.
Браузер автоматически рассчитывает значение для этого свойства, т.к. у него есть значение свойства CSS auto.
Если мы укажем какое-то конкретное значение для свойства width.
<p style="width:300px; border:1px solid #ccc;">Абзац</p>
При изменения ширины окна браузера, он больше не пересчитывает и не изменяет в автоматическом режиме это значение. Оно постоянно будет иметь значение 300 пикселей.
Вот такой смысл работы значения свойств CSS auto. Аналогичным образом это работает и для остальных свойств CSS, которые могут принимать это значение.
В зависимости от каких-то условий, которые происходят с браузером, он будет автоматически менять значение какого-то свойства для нужного элемента.
Чтобы оставить сообщение, зарегистрируйтесь/войдите на сайт через:
Email - зарегистрироваться / войти