📱 响应式预览

输入 HTML 代码,在桌面、平板、手机三种视口下同步实时预览页面效果,检查响应式布局。

关于此工具

把 HTML 代码在桌面(约 1280px)、平板(768px)、手机(375px)三种视口的 iframe 中同步渲染,直观检查响应式断点与适配效果。

如何使用

  1. 输入 HTML

    粘贴或输入页面代码。

  2. 实时预览

    输入自动刷新三个视口。

  3. 检查布局

    对比三端显示效果。

使用场景

页面开发

开发时快速检查响应式。

组件测试

验证组件在移动端表现。

布局调试

定位断点处的样式问题。

常见问题

支持外部资源吗?

iframe 为沙箱环境,外部链接与脚本受限。

能加载本地图片吗?

可用 data URI 或相对资源,但沙箱限制网络请求。

预览是实时吗?

输入停止 0.6 秒后自动刷新。