浮动元素自有其渲染之法，修改宽高影响布局否？
浮动元素的存在使文本内容对其环绕，倘若对其宽高频繁修改，是否会触发大规模的布局调整？
让我们从分层与渲染视角着手，进一步探究问题的答案。
从分层来看，浮动元素与其相邻元素处于同一层级。而从渲染角度观察，图像的绘制（paint）可被称作重绘，布局（layout）则对应重排。
为了验证，我们编写了测试代码：
<!-- 省略代码 --> <div class="box"> <img id="img" src="图像地址" alt="" class="float"> 文本内容 </div> <!-- 省略代码 -->
并使用 javascript 定时修改图片的宽高：
setinterval(() => {
img.dataset.height = (number(img.dataset.height || 0) + 1) % 3;
}, 1000 * 3);从结果来看，在修改 width 属性时，布局被触发。添加 position: absolute; 属性到容器元素后，布局不再被触发。
通过 csstriggers.com 网站查询，我们也得到了相似的结论：
<div class="box" style="position: absolute;"> <img id="img" src="图像地址" alt="" class="float"> 文本内容 </div>
因此，在浮动元素的容器元素设置了 position: absolute; 属性后，修改浮动元素的宽高不会触发重排。
