css3属性resize用户可以手动跳整元素大小

最新推荐文章于 2023-03-07 17:13:05 发布

原创最新推荐文章于 2023-03-07 17:13:05 发布 · 249 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了CSS3中的resize属性，如何允许用户调整元素大小，并强调了与overflow属性的配合使用。通过实例演示了如何在HTML中设置并观察其效果。

css3属性resize用户可以手动跳整元素大小

resize属性指定一个元素是否是由用户调整大小的。

**注意：**resize属性适用于计算其他元素的溢出值是不是"visible"。

默认值：	none
继承：	no
版本：	CSS3
JavaScript 语法：	object.style.resize=“both”

resize: none|both|horizontal|vertical

值	描述
none	用户无法调整元素的尺寸。
both	用户可调整元素的高度和宽度。
horizontal	用户可调整元素的宽度。
vertical	用户可调整元素的高度。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>resize用户可以手动跳整元素大小</title>
<style> 
div
{
	border:2px solid;
	padding:10px 40px; 
	width:300px;
	resize:both;
	overflow:auto;
}
</style>
</head>
<body>

<div>调整属性指定一个元素是否由用户可调整大小的。</div>

</body>
</html>

亲测：resize属性和overflow:auto|hidden|scroll|overlay配合才可以生效。