我正在使用Bootstrap设计我的网站(danielrojas.net),并为XS视口创建了一个单独的布局。当我调整桌面浏览器 (Chrome) 的大小以及 Responsinator.com 或类似设备上试用时,它运行良好。
但是,在我的实际Android手机和平板电脑上(都使用Chrome,也使用内置浏览器进行测试),无论如何都会显示标准版本。我已经包含了魔术视口 META 标签:
<meta name="viewport" content="width=device-width, initial-scale=1">
无济于事。我正在使用定制的 Bootstrap CSS,但即使加载官方的,仍然存在相同的错误。
其他网站(例如 getbootstrap.com)在两种设备上都可以正常工作。我错过了什么?
提前感谢!
你是对的,你已经包含了<meta>
标签。但它在框架中。
通过检查您的代码,它不在主<head>
中。因此,也将其包含在该部分中。
<meta name="viewport" content="width=device-width, initial-scale=1">
我也不确定,响应式是否适用于 iframe,如果它不起作用,您应该避免使用 iframe。