默认jQuery移动CSS样式设置赢得'；不适用，测试了多个浏览器

我正试着玩转并学习一些jquerymobile，但无法应用基本的CSS样式。我正在引用jQuery移动网站上的css链接，并连接到互联网（但也尝试将css本地加载到html中，仍然不适用）

以下是我的测试代码：

2测试
我的照片

我在控制台中看到以下错误

Failed to load resource: net::ERR_UNKNOWN_URL_SCHEME http://code.jquery.com/jquery-1.4.5.min.js Failed to load resource: the     server responded with a status of 404 (Not Found)
jquery.mobile-1.4.5.min.js:3 Uncaught TypeError: Cannot set property 'mobile' of undefined

我认为这是由于JQM尝试解析本地文件的url而失败导致JS崩溃。 要修复此问题，请删除对本地文件路径的引用，改为使用相对路径

实际上，您的某些JQM路径可能不正确：

<!-- add this link here -->
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<!-- remove your link here -->
<!--  <script src="http://code.jquery.com/jquery-1.4.5.min.js></script> -->

另请参见需要在JQM之前包含jquery include或使用bundle

编辑：实际上你有很多问题。JQM对DOM/HTML的操作要比您可能习惯的多得多，并且具有比其他样式框架更严格的结构。你需要从单页应用的角度来思考。页面必须在文件中定义。。我认为您需要查看文档以了解JQM是什么

依照

jQuery Mobile中的页面由具有data role=“page”属性的元素组成。在“页面”容器中，可以使用任何有效的HTML标记，但对于jQuery Mobile中的典型页面，“页面”的直接子级是带有data role=“header”、class=“ui content”和data role=“footer”的div。页面的基线要求只是支持导航系统的页面包装器，其余是可选的

JQM一开始可能会有点混乱——页面div是绝对必需的。您最好先复制和粘贴示例，然后再使用示例，但要获得样式，您需要将内容包装在页面div中

<div data-role="page">
...
</div>

...

---

对于没有图像的示例的工作版本，请参见

在注意到Chrome中的控制台错误“Uncaught Security error Failed to Execute Replace State on History…”后，我搜索了堆栈溢出，发现Chrome的安全功能似乎以某种方式阻止了从外部源加载

我试着从web服务器加载页面，唉，CSS在Chrome中呈现！ 它也可以在本地Firefox上运行！Chrome浏览器不允许我在本地测试

见：

我尝试将

添加到我的代码中，就像你的jfiddle一样。css仍然没有在我的chrome浏览器中呈现（奇怪的是，css确实应用在小提琴中…为什么？？）我尝试替换你建议的链接，但控制台说该链接无法识别。重新检查了jquery移动站点，发现我之前的链接是正确的，所以我再次替换了它。我的脚本顺序总是1.jQuery 2.jQuery mobile，所以我认为这不是问题所在。（顺便说一句，删除图像以使事情不复杂化）我仍然感到困惑