TGViewer
Frontend Interview - собеседования по Javascript / Html / Css Frontend Interview - собеседования по Javascript / Html / Css @frontendinterview · 10.4K subscribers
Post #4385 1.93K
​Можно ли увеличить или уменьшить поле ввода? Управляем этим через стили.

Свойство resize указывает, может ли пользователь изменять размеры элемента, и в каком направлении. В случае, если изменение размеров элемента возможно, в одном из его углов появится специальная иконка, похожая на треугольник, зажав которую пользователь сможет изменить размер элемента в одном, или нескольких, направлениях.

Часто используется для <textarea>, но можно применить к любому элементу, кроме:

- строчных (inline) элементов;
- блочных (block), для которых задано свойство overflow со значением visible (является значением по умолчанию для большинства элементов).

По умолчанию поле ввода <textarea> может изменять свой размер, если потянуть за нижний правый угол. Если вы хотите запретить изменение размеров текстовой области, вы должны явно указать значение свойства resize как none.

Как пишется
- none — размеры изменить нельзя (значение по умолчанию).
- both — размеры можно изменять по горизонтали и вертикали.
- horizontal — размер можно изменять по горизонтали.
- vertical — размер можно изменять по вертикали.

Экспериментальные значения:
- block — размер можно изменять в блочном измерении элемента.
- inline — размер можно изменять в строковом измерении элемента.
Блочное или строчное измерение элемента зависит от направления текста, задаваемого свойствами writing-mode и direction.

По умолчанию поддерживается в Firefox и Safari. В браузерах Chrome и Edge необходимо включить флаг Experimental Web Platform features. Более подробную информацию можно узнать на caniuse.

👉 @frontendInterview
  • 👍 5
More from @frontendinterview
  1. Oct 16, 2026🧩 Как сделать, чтобы фоновый узор не обрезался снизу У секции повторяющийся фоновый узор,…
  2. Oct 15, 2026АЙТИШНИКИ БЕСПЛАТНОЕ ОБУЧЕНИЕ Проект «Terminal» стал крупнейшей библиотекой бесплатного об…
  3. Oct 14, 2026✨ Скроллбар, который следит за прокруткой без JavaScript Свой скроллбар обычно рисуют так:…
  4. Oct 14, 2026Атмосфера HolyJS: ради чего стоит приехать на площадку 23–24 октября в Санкт Петербурге и…
  5. Oct 12, 2026✨ CSS может заметить, что элементы вот-вот столкнутся Сбоку от секции с карточками висит д…
  6. Oct 9, 20265 офферов получили наши ребята на прошлой неделе Оффер на 4,2k долларов Оффер на 5k евро О…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →