无法使用dotnetnuke进行bootstrap响应式设计工作

Sid*_*dey 10 css dotnetnuke twitter-bootstrap

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

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

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

And*_*ich 36

你错过了针对适当规模的移动设备的元数据.在页面标题中插入以下内容:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
Run Code Online (Sandbox Code Playgroud)


小智 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">
Run Code Online (Sandbox Code Playgroud)


Ser*_*lov 7

确保基本之后包括响应式CSS(responsive.css).