bootstrap的tooltip

bootstrap官方自带有tooltip插件，用起来挺好看的，也不用去找其他的了，看看其效果来：

就是这样的效果：当鼠标悬停在小图标上时，出现对该项的解释，我还是用JavaScript的方式实现。整个页面的代码我就不贴了，太长了，看的晕乎乎的，我只贴出来相关的代码。

html代码：

<label for="inputPassword3" class="col-sm-offset-1 col-sm-3 control-label">查询单价&nbsp;<span class="glyphicon glyphicon-info-sign"></span></label>

css代码，用来控制一下图标的大小，使得其跟整个页面看起来更和谐：

.glyphicon-info-sign{
		font-size:12px;
		cursor: pointer;
	}

js代码：

  $(".glyphicon-info-sign:first").tooltip({
             trigger: 'hover',
              html:true,
              placement: 'auto top',
              title: function(){
                return  "查询单价:合同打款金额/查询次数，或合同上定好的查询单价";
              },
              container:'body'
        });

注意，还记得前边说过的bootstrap的popover弹出框插件吗，这里的tooltip跟popover是类似的，但是有一点不同的是这里是用来显示内容的属性是tooltip的title属性，而popover里面是content属性。