Egenskaben resize

Egenskaben resize forbyder eller tillader ændring af størrelsen på textarea eller andre elementer (med andre elementer virker det ikke i alle browsere).

Syntaks

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

Værdier

Værdi Beskrivelse
both Elementet kan strækkes i bredden og højden.
horizontal Elementet kan kun strækkes i bredden.
vertical Elementet kan kun strækkes i højden.
none Det er ikke muligt at ændre elementets størrelse.

Standardværdi: none. For textarea i nogle browsere: both. I de browsere, der ikke understøtter resize, vil textarea opføre sig, som om værdien none er angivet.

Eksempel . Værdien both

Elementet strækkes i begge retninger:

html<textarea></textarea>
csstextarea {
  resize: both;
  width: 200px;
  height: 200px;
}

Результат:

Eksempel . Værdien horizontal

Elementet strækkes kun vandret:

html<textarea></textarea>
csstextarea {
  resize: horizontal;
  width: 200px;
  height: 200px;
}

Результат:

Eksempel . Værdien vertical

Elementet strækkes kun lodret:

html<textarea></textarea>
csstextarea {
  resize: vertical;
  width: 200px;
  height: 200px;
}

Результат:

Eksempel . Værdien none

Elementet strækkes slet ikke:

html<textarea></textarea>
csstextarea {
  resize: none;
  width: 200px;
  height: 200px;
}

Результат:

Eksempel . Begrænsning af bredde og højde

Minimum og maksimum bredde og højde kan begrænses ved hjælp af egenskaberne max-width, min-width, max-height, min-height:

html<textarea></textarea>
csstextarea {
  resize: both;
  min-height: 100px;
  max-height: 300px;
  min-width: 100px;
  max-width: 300px;
}

Результат: