Ширина элемента: width

width

Поддержка браузерами
Настольные браузеры Chrome Firefox Internet Explorer Opera Safari
Базовая поддержка, версии браузеров 1.0 1.0 4 3.5 1.0
Свойство
width — это свойство задает ширину блочного элемента
Описание
Свойство позволяет установить нужную ширину блочного элемента. Каждый элемент на странице представляет собой блок, этот блок имеет несколько составляющих — поля, границы, отступы и непосредственно сам контент:

Поля — margin

Границы — border

Отступы — padding

Контент

Каждая составляющая блока имеет четыре стороны, эти стороны имеют следующие названия:

width

Ширина рассчитывается следующим образом:

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

то высота будет равняться:

Наследование
Не наследуется. Это значит что стили применённые к родительскому элементу не передадутся потомкам
Применяется
К блочным элементам и замещаемым встроенным элементам (к таким элементам относятся, например, изображения)
Может принимать значения
значение в абсолютных единицах | значение в относительных единицах | auto | inherit
Значение по умолчанию
auto
Правила записи
свойство: значение;
Примеры

<p>

Ширина этого абзаца 200 пикселей + ширина границ

</p>

<p>

Ширина этого абзаца 6em + ширина границ

</p>

<div>

Ширина этого контейнера 50% от размера родительского элемента, в данном случае родительским элементом является ячейка таблицы

</div>

<div>

Ширина этого контейнера auto, это значит что ширина рассчитывается автоматически

</div>

<p>

Это значит что свойство унаследует значение от родителя

</p>

Поделиться