固定宽度像素数量 固

使用百分比而不是像素移动响应 布局和位置单元选项。 可视化编辑器会自动将像素数量转换为相应的百分比数量。 现在让我们在平板电脑和移动模式下查看页面，看看该解决方案如何适用于较小的屏幕尺寸： 移动响应使用百分比 在平板电脑和移动设备编辑模式下，左边距指定为百分比的 元素。 看起来不错！ 错误 ：使用具有固定或最小宽度的大像素数量 分配了最小宽度的元素将显示指定的大小或更大。分配了固定宽度的元素将显示指定的大小，而不管屏幕大小。

宽度将此内容框

这里是记住断点有帮们使用固定助的地方：当在小于 像素宽的浏览器窗口中查看页面时，使用 构建的页面将显示页面的移动版本。 那么，当页面上的元素设置为超过 像素宽 加拿大医疗保健和医疗电子邮件列表 时会发生什么？让我元素设置为 像素宽，看看会发生什么。（请注意，将宽度设置为最小 像素将产生相同的结果。） 移动响应大定宽度为 像素的内容框。 在桌面模式下，页面看起来不错。然而，在移动设备上，事情看起来不太对劲。

示页面的浏览器窗

大的固定宽度像素数量导致水平滚动条 固定宽度为 像素的内容框超出移动设备屏幕的边缘，导致设备显示水平滚动条（突出显示）。 因为元素的宽度（ 像素）超过了显口的宽度（小于 像素），所以浏览器必须通过添加水平滚动条来 DY线索 容纳额外的宽度。 那么，如何避免这种情况呢？ 解决方案 ：使用百分比单位而不是像素单位 请记住，百分比单位会将元素按比例缩放到它周围的容器；而像素单位是固定的度量。 让我们对我们的例子做一个简单的改变。