rem 的onresize
时间: 2023-06-25 18:03:42 浏览: 116
利用onresize使得div可以随着屏幕大小而自适应的代码
`onresize` 是一个 HTML 元素的事件属性,在元素的大小发生变化时触发。`rem` 是一种相对于根元素字体大小的长度单位,用于响应式网页设计。因此,`onresize` 事件和 `rem` 单位之间并没有直接的关联。
在使用 `rem` 进行响应式设计时,可以通过 JavaScript 监听 `onresize` 事件来动态改变根元素的字体大小,从而实现页面布局的自适应。例如:
```javascript
window.onresize = function() {
var windowWidth = window.innerWidth;
var fontSize = windowWidth / 20; // 将根元素的字体大小设置为屏幕宽度的 1/20
document.documentElement.style.fontSize = fontSize + 'px';
}
```
这段代码会在窗口大小发生变化时触发 `onresize` 事件,计算出根元素的字体大小,并将其设置为新值。这样,在使用 `rem` 单位进行布局时,元素的大小会随着窗口大小的变化而自适应调整。
阅读全文