O atributo resize é uma propriedade na UI CSS3 que permite ao usuário redimensionar um elemento. O atributo resize é uma propriedade na UI CSS3 que permite ao usuário redimensionar um elemento.
redimensionar: nenhum | ambos | horizontal | vertical;
A sintaxe é explicada da seguinte forma:
● nenhum: Os usuários não podem ajustar o tamanho do elemento;
●ambos: Os usuários podem ajustar a altura e a largura dos elementos;
●horizontal: O usuário pode ajustar a largura do elemento;
●vertical: O usuário pode ajustar a altura do elemento.
Você também precisa prestar atenção aos seguintes pontos ao usar o atributo resize:
●Definir apenas o atributo de redimensionamento é inválido. O atributo de redimensionamento precisa ser usado em conjunto com o atributo overflow para ser eficaz, e o valor do atributo overflow precisa ser definido como automático, oculto ou rolagem;
●Nem todos os elementos podem ser definidos com o atributo resize. Por exemplo, os atributos img e table não podem usar o atributo resize.
(redimensionar) ajustar o tamanho do elemento
1. Redimensionar: nenhum redimensionar: nenhum
Exemplo:
<!DOCTYPEhtml><html><head><style>div{border:3pxsolid;padding:15px;width:300px;resize:none;}</style></head><body><h1>TheresizeProperty</h1 ><div><p>redimensionar: nenhum</p></div></body></html>
Resultados em execução:
2.Redimensionar: ambos
Exemplo:
<!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 em execução:
3.Redimensionar: redimensionar horizontalmente: horizontal
Exemplo:
<!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 em execução:
4.Redimensionar: redimensionar vertical: vertical
Exemplo:
<!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 em execução: