[英]Icons not displaying with custom theme
我正在使用带有在themeroller上创建的自定义主题的jQuery mobile根据我必须包含在<head>
:
<link rel="stylesheet" href="themes/mycustomtheme.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile.structure-1.4.0.min.css" />
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
我的自定义主题完美显示,但是如果我想使用如下图标:
<a href="#home" data-transition="slideup" data-role="button" data-icon="home">Home</a>
“主页”图标不显示。 它仅显示一个空圆圈。
我使用谷歌浏览器。
我应该包括什么来解决此问题?
请注意, data-role="button"
在1.4中已弃用,将从1.5中删除,现在手动添加类。
<a href="#page" class="ui-btn ui-btn-icon-left ui-icon-home">Anchor</a>
而且,jQM现在将SVG图标用于支持SVG的平台,将普通图标用于不支持SVG的平台。 使用伪选择器:after
将图标添加到元素:after
。
创建自定义图标非常简单,如下面的CSS所示。
.ui-custom-icon:after {
background-image: url('custom-icon.png');
background-size: 25px 25px; /* dont forget this */
}
现在,将.ui-custom-icon
添加到任何元素。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.