El atributo de cambio de tamaño es una propiedad en la interfaz de usuario CSS3 que permite al usuario cambiar el tamaño de un elemento. El atributo de cambio de tamaño es una propiedad en la interfaz de usuario CSS3 que permite al usuario cambiar el tamaño de un elemento.
cambiar tamaño: ninguno|ambos|horizontal|vertical;
La sintaxis se explica a continuación:
● ninguno: los usuarios no pueden ajustar el tamaño del elemento;
●ambos: los usuarios pueden ajustar la altura y el ancho de los elementos;
●horizontal: El usuario puede ajustar el ancho del elemento;
●vertical: El usuario puede ajustar la altura del elemento.
También debe prestar atención a los siguientes puntos cuando utilice el atributo de cambio de tamaño:
●Establecer el atributo de cambio de tamaño solo no es válido. El atributo de cambio de tamaño debe usarse junto con el atributo de desbordamiento para que sea efectivo, y el valor del atributo de desbordamiento debe establecerse en automático, oculto o desplazamiento;
●No todos los elementos se pueden configurar con el atributo de cambio de tamaño. Por ejemplo, los atributos img y table no pueden usar el atributo de cambio de tamaño.
(cambiar tamaño) ajustar el tamaño del elemento
1. Cambiar tamaño: ninguno cambiar tamaño: ninguno
Ejemplo:
<!DOCTYPEhtml><html><head><style>div{border:3pxsolid;padding:15px;width:300px;resize:none;}</style></head><body><h1>TheresizeProperty</h1 ><div><p>cambiar tamaño:ninguno</p></div></body></html>
Resultados de ejecución:
2.Redimensionar: ambos
Ejemplo:
<!DOCTYPEhtml><html><head><style>div{border:3pxsolid;padding:15px;width:300px;resize:both;overflow:auto;}</style></head><body><h1> TheresizeProperty</h1><div><p>resize:both</p></div></body></html>
Resultados de ejecución:
3.Redimensionar: horizontal cambiar tamaño: horizontal
Ejemplo:
<!DOCTYPEhtml><html><head><style>div{border:3pxsolid;padding:15px;width:300px;resize:horizontal;overflow:auto;}</style></head><body><h1> TheresizeProperty</h1><div><p>resize:horizontal</p></div></body></html>
Resultados de ejecución:
4.Redimensionar: vertical cambiar tamaño: vertical
Ejemplo:
<!DOCTYPEhtml><html><head><style>div{border:3pxsolid;padding:15px;width:300px;resize:vertical;overflow:auto;}</style></head><body><h1> TheresizeProperty</h1><div><p>resize:vertical</p></div></body></html>
Resultados de ejecución: