Promijeniti veličinu - CSS-trikovi

The resizeproperty kontrolira da li i kako se element može se mijenjati od strane korisnika klikom i povlačenjem donji desni kut elementa.

.module ( resize: both; )

Super je važno znati: resize ne radi ništa osim ako overflowsvojstvo nije postavljeno na nešto drugo osim visiblešto je njegova početna vrijednost za većinu elemenata.

Također je vrijedno znati da će vam Firefox omogućiti promjenu veličine elementa manjeg od njegove izvorne veličine. Preglednici Webkit neće vam dopustiti da promijenite veličinu elementa kako biste ga učinili manjim, samo većim (u obje dimenzije).

Vrijednosti

none: elementu se ne može promijeniti veličina. To je početna vrijednost za većinu elemenata. textareaElement je najčešći iznimkama u mnogim preglednicima njegova zadana resizevrijednost both.
both: korisnik može promijeniti veličinu elementa u visinu i / ili širinu.
horizontal: korisnik može horizontalno promijeniti element (povećavajući širinu).
vertical: korisnik može okomito promijeniti veličinu elementa (povećavajući visinu).
inherit: element nasljeđuje vrijednost promjene veličine svog roditelja.

Kad je elementu moguće promijeniti veličinu, na donjem uglu ima malu ručicu sučelja. Ručka se pojavljuje s desne strane elemenata stranice kada je stranica directionpostavljena na ltr(slijeva udesno), a slijeva na stranicama rtl(zdesna ulijevo).

Element bez ručke (sprijeda) i s ručkom (straga)

Demo

Element koji se može promijeniti u ovoj demonstraciji je odlomak. Kliknite gumbe da biste isprobali različite resizevrijednosti.

Pogledajte demonstracijsku veličinu olovke CSS-Tricks (@ css-tricks) na CodePenu.

Povezano

overflow
direction

Više informacija

Spec
Mozilla dokumenti
Članak Davida Walsha
Trikovi Textarea

Podrška preglednika

Podaci o podršci preglednika potječu iz tvrtke Caniuse, koja sadrži više detalja. Broj označava da preglednik podržava značajku u toj verziji i novijoj.