Właściwość CSS – resize

Kategoria wpisu Interfejs, Kurs CSS, Kursy, PHP, HTML, CSS Tagi: , , , , on przez .



Reading Time: 1 minute

Dzięki właściwość CSS resize użytkownik zyskuje możliwość zmiany rozmiaru danego pola (np. div lub textarea).

Właściwość resize jest ściśle powiązana z overflow. Cecha nie będzie działać jeśli overflow=”visible”. Dopuszczalne wartości to „scroll”, „auto”, albo „hidden”.

Ustawienia resize

resize przyjmuje kilka wartości

  • none – brak
  • both – można dowolnie rozszerzać, zmieniać wymiary (bok, dół)
  • horizontal – można rozszerzać w bok
  • vertical – można rozszerzać w dół
  • initial – ustawienia domyślne
  • inherit – dziedziczy ustawienia rodzica

Przykłady:

Podstawowe wymiary przykładowych prostokątów – CSS

none

Kod HTML


resize: both

Kod HTML

Kod CSS


resize: horizontal

Kod HTML

Kod CSS


vertical

Kod HTML

Kod CSS


resize: initial

Kod HTML

Kod CSS


resize: inherit

Kod HTML

Kod CSS

Interpretacja przez przeglądarki

WłaściwośćChromeIE / EdgeFirefoSafariOpera
resize4.0nie działa5.0
4.0 -moz-
4.015.0

źródło:
https://www.w3schools.com/cssref/css3_pr_resize.asp

przeciąganie, zmienianie rozmiarów pola tekstowego z pomocą CSS

Przeczytaj również

Lustrzane odbicia obrazków z CSS Dzisiaj pokażę wam jak uzyskać efekt lustrzanego odbicia obrazka (ang. CSS image reflections) z pomocą CSS. Aktualnie z pomocą CSS można uzyskać ten e...
Wstęp do SASS – Instalacja i podstawowe kome... SASS jest rozszerzeniem języka kaskadowych styli CSS (preprocesorem) umożliwiającym wydajniejszą pracę. Oczywiście nie jest to jedyny tego typu skrypt...
Tabele w HTML Tabele są jednym z podstawowych znaczników w języku HTML. Przed wejściem stron RWD tabele HTML były najczęściej spotykanym obiektem na stronie. Chyba ...
Zmiana koloru linka po najechaniu kursorem –... Zmiana koloru linku () stanowi jeden z podstawowych efektów, jakie występują na stronie internetowej. Domyślnie tę cechę pos...

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *