0

如果我在我的 html 数据图标中使用 CDN 托管的 javascript 和 css url 正确显示。如果我在项目中使用本地文件夹位置，则它不起作用。找到以下代码以供参考。我只有下面提到的 CDN url 中的内容。请建议我做错了什么。

下面的代码不起作用，正在显示圆形图标，但我没有在图标内看到信息徽标“i”。 

<!DOCTYPE html>
 <html>
 <head>
 <meta charset="UTF-8">
 <title>Insert title here</title>
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.css" type="text/css" />
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.3.2.js"></script>
 </head>
<body>
<div data-role="page" id="test">
    <div data-role="header" data-theme="b">
        <a href="#home" data-icon="info" data-iconpos="notext"></a>
        <h1>Home</h1>
    </div>
</div>
</body>
</html>

如果我使用 CDN url，此代码有效，带有信息符号的图标即将到来

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.css" type="text/css" />
<script type="text/javascript" src="code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.js"></script>
</head>
<body>
<div data-role="page" id="test">
    <div data-role="header" data-theme="b">
        <a href="#home" data-icon="info" data-iconpos="notext"></a>
        <h1>Home</h1>
    </div>
</div>
</body>
</html>
4

2 回答 2

3

如果您在本地使用它，则需要将图标图像上传到服务器。在第二个示例中，CDN 将为您托管图像，因为 css 正在与 css 文件相关的文件夹中查找。

在图标类的 CSS 中，您会看到它使用以下内容：

background-image: url(images/icons-36-white.png);

所以你需要从 jquery 下载图标文件。例如从这里：http ://code.jquery.com/mobile/1.3.2/images/icons-36-white.png

于 2013-08-21T12:42:10.427 回答
1

如果您正在托管 jQuery Mobile 的 CSS 样式表，那么您还需要托管图像（在 JS 和 CSS 文件所在的同一个 .zip 文件中找到）

图像精灵应该在一个名为 images 的目录中，该目录与 jQuery Mobile CSS 样式表位于同一目录中（样式表相对引用这样的图像：background-image: url(images/icons-18-white. .png); ).

源位置

于 2013-08-21T12:45:32.780 回答