Resize xususiyati

resize xususiyati textarea yoki boshqa elementlarning o‘lchamlarini o‘zgartirishni taqiqlaydi yoki ruxsat beradi (boshqa elementlar bilan barcha brauzerlarda ishlamaydi).

Sintaksis

cssselector {
  resize: both | horizontal | vertical | none;
}

Qiymatlar

Qiymat	Tavsif
`both`	Elementni kenglik va balandlik bo‘yicha cho‘zish mumkin.
`horizontal`	Elementni faqat kenglik bo‘yicha cho‘zish mumkin.
`vertical`	Elementni faqat balandlik bo‘yicha cho‘zish mumkin.
`none`	Element o‘lchamlarini o‘zgartirish mumkin emas.

Standart qiymat: none. textarea uchun ba’zi brauzerlarda: both. resize ni qo‘llab-quvvatlamaydigan brauzerlarda, textarea none qiymati berilgandek harakat qiladi.

Misol . Both qiymati

Element ikkala tomonga cho‘ziladi:

html<textarea></textarea>

csstextarea {
  resize: both;
  width: 200px;
  height: 200px;
}

Результат:

Misol . Horizontal qiymati

Element faqat gorizontal ravishda cho‘ziladi:

html<textarea></textarea>

csstextarea {
  resize: horizontal;
  width: 200px;
  height: 200px;
}

Результат:

Misol . Vertical qiymati

Element faqat vertikal ravishda cho‘ziladi:

html<textarea></textarea>

csstextarea {
  resize: vertical;
  width: 200px;
  height: 200px;
}

Результат:

Misol . None qiymati

Element umuman cho‘zilmaydi:

html<textarea></textarea>

csstextarea {
  resize: none;
  width: 200px;
  height: 200px;
}

Результат:

Misol . Kenglik va balandlikni cheklash

max-width, min-width, max-height, min-height xususiyatlari yordamida minimal va maksimal kenglik va balandlikni cheklash mumkin:

html<textarea></textarea>

csstextarea {
  resize: both;
  min-height: 100px;
  max-height: 300px;
  min-width: 100px;
  max-width: 300px;
}

Результат: