Question

我无法在jquery mobile中找到菜单navicon（3行1）。

我能找到的最近的是ui-icon-grid。

在jquery mobile中，navicon是否可用，或者是否有不同的实现可用？

Answer 1

选中此项：jQuery Mobile Icons。我认为它是bars（ui-icon-bars）你在寻找什么。

如果您需要更多种类的图标（字体图标），Font Awesome可能派上用场：Font Awesome icons。这里称为fa-bars。

修改

正如Cindy指出的那样，某些字体图标并不总是按照需要显示，因此在某些情况下使用SVG将是最佳选择。 Here SVG图标和字体图标之间存在比较，浏览器支持和文件大小是后者的主要优点。

也许这是一个最好的解决方案（我还没有使用它，但对我来说看起来不错）：IcoMoon让你只选择你需要的图标（你也有你要求的图标））和您想要的格式（字体或SVG）。此外，您可以配置一些其他选项，如包括PNG，包括SVG精灵，尺寸，颜色......）。

Answer 2

您可以使用CSS：

没有图片：

a {
    text-decoration:none;
    font-size:50px;
    font-weight:700;
    display:inline-block;
    transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    /* IE 9 */
    -webkit-transform:rotate(90deg);
    /* Opera, Chrome, and Safari */
    color:white; //Change the color you want for your icon
    letter-spacing:-3px;
    height:34px;
    width:34px;
}

演示：http://jsfiddle.net/lotusgodkk/x6g7S/1/

带图片：

#A_1 {
    height: 40px;
    left: 10px;
    position: absolute;
    width: 40px;
    background: rgba(0, 0, 0, 0) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAZCAYAAADE6YVjAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADhJREFUeNpi/P//PwOtARMDHQBdLGFBYtMq3BiHT3DRPU4YR4NrNAmPJuHRJDyahEeT8Ii3BCDAAF0WBj5Er5idAAAAAElFTkSuQmCC) no-repeat scroll 50% 50% / auto padding-box border-box;
    }

演示：http://jsfiddle.net/lotusgodkk/x6g7S/

在jquery mobile中有3条水平线navicon

2 个答案: