/* 让div元素的宽度始终等于浏览器窗口宽度 */ div{ width: 100%; } /* 让div元素的高度随浏览器窗口的高度变化而变化 */ div{ height: 100vh; } /* 同时让div的宽度和高度自适应 */ div{ width: 100%; height: 100vh; } /* 让div元素的宽度随浏览器窗口宽度的变化而自动缩放 */ div{ max-width: 100%; } /* 设置div元素的最小宽度 */ div{ min-width: 200px; } /* 让div元素始终位于浏览器窗口的中央 */ div{ position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
使用以上这些代码片段,你就可以轻松地实现div的自适应功能,让你的网站更加美观和易用。