jquery mobile中的3条水平线navicon

Question

我无法在 jquery mobile 中找到菜单导航图标（第 3 行）。

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

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

Answer 1

您可以为此使用 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/

Answer 2

检查这个：jQuery Mobile Icons。我认为您正在寻找的是bars (ui-icon-bars)。

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

编辑：

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

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