0

我已经尝试了很多人在网站、论坛上提出的建议。(激活工具提示)但我仍然没有成功。我在自己的布局文件中添加了这个编码。视图/布局

导航栏小部件编码

 'items' => [  
            [
              'label' => '<span style="font-size:1.3em;" class="glyphicon glyphicon-cog"></span>', 
              'url' => ['/site/controlPanel'],
              'options' =>[ 
                              'data-toggle' => 'tooltip',  
                              'data-placement' => 'tooltip',
                              'title' =>'Control Panel', 
                              'class' => 'tooltipStyle'
                          ],
            ],
            [
              'label' => '<span style="font-size:1.3em;" class="glyphicon glyphicon-tasks"></span>', 
              'url' => ['/site/controlPanel'],
              'options' =>[ 
                              'data-toggle' => 'tooltip',  
                              'data-placement' => 'tooltip',
                              'title' =>'Day Summary',
                              'class' => 'tooltipStyle'
                          ],
            ],

CSS

.tooltipStyle + .tooltip > .tooltip-inner {
background-color: #000;
}
.tooltipStyle + .tooltip > .tooltip-arrow { 
    border-bottom-color:#ff0; 
}

最终我只想像这样出去

在此处输入图像描述

在对我的编码进行了一些修改之后,显示了这个输出。

在此处输入图像描述

4

1 回答 1

3

您可以通过这种方式将标题添加到标签中的标签...

'items' => [  
        [
          'label' => '<span style="font-size:1.3em;" 
                   class="glyphicon glyphicon-cog"</span>'
            . '  Control Panel', 
          'options' =>[ 'data-toggle' => 'tooltip',  
                        'data-placement' => 'tooltip',
                         'title' =>'Notifications', 
                          'class' => 'myTooltipClass']
          'url' => ['/site/controlPanel'],
          'data-toggle' => 'tooltip',
          'title' => 'Control Panel',
        ],

在你的css中添加这个类(例如:改变颜色)

.myTooltipClass + .tooltip > .tooltip-inner {background-color: #ff0;}
.myTooltipClass + .tooltip > .tooltip-arrow { border-bottom-color:#ff0; }
于 2016-01-17T12:37:16.240 回答