面试题：CSS 中媒体查询与响应式单位结合实现响应式布局

Question

假设要为一个网页设计响应式布局，在屏幕宽度小于 768px 时，将页面主体文字字体大小设为 14px，使用 rem 作为响应式单位，同时图片宽度占满屏幕宽度且高度自适应。请写出对应的 CSS 代码。

Answer 1

@media (max - width: 768px) {
    html {
        font - size: 14px;
    }
    body {
        font - size: 1rem;
    }
    img {
        width: 100%;
        height: auto;
    }
}