CSS width Свойство
Пример
Задайте ширину трех элементов <div>:
div.a {
width: auto;
border: 1px
solid black;
}
div.b {
width: 150px;
border: 1px solid black;
}
div.c {
width:
50%;
border: 1px solid black;
}
Подробнее примеры ниже.
Определение и использование
Свойство width
задает ширину элемента.
Ширина элемента не включает отступы, границы или поля!
Примечание: Свойства min-Width и max-width переопределяют width
свойство.
Значение по умолчанию: | auto |
---|---|
Inherited: | no |
Animatable: | yes. Читайте о animatable |
Version: | CSS1 |
Синтаксис JavaScript: | object.style.width="500px" |
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Свойство | |||||
---|---|---|---|---|---|
width | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Синтаксис CSS
width: auto|value|initial|inherit;
Значения свойств
Значение | Описание | |
---|---|---|
auto | Значение по умолчанию. Обозреватель вычисляет ширину | |
length | Определяет ширину в пикселах, см и т. д. читать о единицах длины | |
% | Определяет ширину в процентах от содержащего блока | |
initial | Присваивает этому свойству значение по умолчанию. (Читайте о initial) | |
inherit | Наследует это свойство из родительского элемента. (Читайте о inherit) |
Другие примеры
Пример
Задайте ширину элемента <img>, используя значение процента:
img {
width: 50%;
}
Пример
Задайте ширину < входного типа = "Text" > элемент 100px. Однако, когда он получает фокус, сделать его 250пкс широкий:
input[type=text] {
width: 100px;
}
input[type=text]:focus {
width: 250px;
}
Похожие страницы
CSS Справочник: CSS Height and Width
CSS Справочник: CSS Box model
CSS Справка: height Свойство
HTML DOM Справочник: width Свойство