Question

是否可以在Yii2 Bootstrap Nav Bar菜单项中添加图像？在official doc我找不到任何选项。

我想显示图片而不是标签文字！

导航条形码是。

<?php
    NavBar::begin([
        'brandLabel' => 'My Company',
        'brandUrl' => Yii::$app->homeUrl,
        'options' => [
            'class' => 'navbar-inverse navbar-fixed-top',
        ],
    ]);

   $menuItems = [];

   $menuItems[] = [
            'label' => Yii::t('app','Language'),
            'items' => [
                [
                  'label' => 'English', 
                  'url' => ['site/language','set'=>'en'],
                ],

                '<li class="divider"></li>',

                [
                  'label' => 'Danmark',
                  'url' => ['site/language','set'=>'da'],
                ],

              ],
      ];

Answer 1

如果图标可以使用图标

   $menuItems[] = [
        'label' => Yii::t('app','Language'),
        'items' => [
            [
              'label' => 'English', 
              'url' => ['site/language','set'=>'en'],
              'icon'=> 'cog',
            ],

如果img和标签中的html代码

  $menuItems[] = [
        'label' => Yii::t('app','Language'),
        'items' => [
            [
              'label' => '<img src="smiley.gif" ><span>sample</span>', 
              'url' => ['site/language','set'=>'en'],
            ],

我用

use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;

你应该设置'encodeLabels'=＆gt;假，

        echo Nav::widget([
            'options' => ['class' => 'navbar-nav navbar-right'],
            'items' => $menuItems,
            'encodeLabels' => false,
        ]);

Answer 2

添加'encodeLabels'=＆gt; false，作为Nav :: widget的属性。否则它不会将代码转换为HTML，它会将其视为字符串，它将显示在标签内部。

echo Nav::widget([
    'options' => ['class' => 'navbar-nav navbar-left'],
    'encodeLabels' => false,
    'items' => [
        [
            'label' => '<span class="glyphicon glyphicon-home"></span>', 
            'url' => ['/site/dashboard'],
        ],
    ] // Close of items
    ]); // Close of Nav::Widget.

Answer 3

将图像标记添加到＆＃39; brandLabel＆＃39;设定：

NavBar::begin([
    'brandLabel' => '<img id="logo" src="/img/logo.svg" alt="logo">',
    'brandUrl' => Yii::$app->homeUrl,
    'options' => [
        'class' => 'navbar',
    ],
]);

Yii2 Nav Bar在菜单项中添加图像

3 个答案: