10

我在 DotNetNuke 的项目中使用了 twitter 引导程序。我使用 HTML、CSS、bootstrap 进行设计和布局。当我在不同的移动设备上测试响应式设计时,即使我调整了浏览器窗口的大小,响应式设计也能正常工作。

由于它运行良好,我将设计转换为 DotNetNuke Skin。现在,响应式设计只有在我调整浏览器窗口大小时才能正常工作,而不是在移动设备上。我了解 DNN 加载样式表的流程,并且我遵循了它。我已经将我的 skin.css 作为 bootstrap.css 的组合,然后是 bootstrap-responsive.css 的内容

我无法找到问题,就好像我对我的 html 使用相同的 skin.css,它工作正常,但它不适用于 DNN(在移动设备上)。

4

3 回答 3

38

您缺少针对移动设备以实现适当规模的元数据。在页面标题中插入以下内容:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
于 2012-05-22T11:12:42.963 回答
10

我只是注意到一些有趣的事情并想分享它,也许它会对某人有所帮助。在站点标题部分中,您应该首先包含 bootstrap.css,然后才包含 bootstrap-responsive.css,因为显然 responsive.css 取决于 bootstrap.css

当然,元标记也应该存在。

<link href="/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />  
<meta name="viewport" content="width=device-width, initial-scale=1.0">
于 2012-09-30T19:06:34.727 回答
7

确保在basic之后而不是之前包含响应式 CSS(responsive.css) 。

于 2012-11-22T12:55:38.777 回答