resize

Описание

Свойство resize позволяет пользователю изменять размеры элемента.

resize
Значения: none | both | horizontal | vertical | inherit
Начальное значение: none
Область применения: блочные элементы и ячейки таблиц
Наследование: нет
Поддержка браузерами: Chrome 1+, Safari 3+, Firefox 4+
Версия CSS: CSS 3
Примечание:

Синтаксис

resize: none | both | horizontal | vertical | inherit

Значения

none
Элемент не предполагает изменение размера пользователем.
both
Предполагает изменение размера элемента по вертикали и горизонтали.
horizontal
Предполагает изменение размера элемента по горизонтали.
vertical
Предполагает изменение размера элемента по вертикали.

В Firefox по-умолчанию для <textarea> возможно изменять размеры.

Свойство resize не применимо к элементам, у которых для свойства overflow задано значение visible.

Пример

p.one {
    resize: both;
    width: 500px;
	overflow: scroll;
	border: 2px solid red;
}
p.two {
	resize: horizontal;
	width: 500px;
	overflow: scroll;
	border: 2px solid red;
}	
<!DOCTYPE HTML>
<head>
	<meta http-equiv="content-type" content="text/html" />
    <title>Свойство css resize</title>
</head>
<body>
	<p class="one">Lorem ipsum dolor sit amet, quisque nulla risus, ultrices aenean suscipit. Enim dolor mauris. Sociis tellus adipiscing, magnis dictum nulla, nunc dui. In sodales, euismod cursus. Ut interdum vivamus, velit in tristique, nullam vehicula sit. Sapien mauris.<p>
	<p class="two">Volutpat fermentum, mi felis. Porttitor purus orci, diam molestie ultrices. Fermentum nunc rutrum, tempore justo. Wisi condimentum purus, magna id aenean, sed placerat in. Pede sodales, etiam lorem, sem turpis.</p>
</body>
</html>

Результат

ДЕМО

Комментарии к записи resize: 1

  1. chipolla сказал(а):

    Мне все же искренне кажется, что в подобных статьях есть смысл указать, что в IE вплоть до последней версии и Opera данное свойство просто не поддерживается и не очень хорошо поддерживается в Firefox.
    http://htmlbook.ru/css/resize

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *