angular-bootstrap-阿里云开发者社区

开发者社区> 开发与运维> 正文

angular-bootstrap

简介: bootstrap是很好用的css框架,angularJS对其进行了集成。 项目主页:https://angular-ui.github.io/bootstrap/ 通常来讲,需要引入AngularJS,bootstrap.css。 1.tooltip angular已经封装好了tooltip这个指令。 <button tooltip='some words to s

bootstrap是很好用的css框架,angularJS对其进行了集成。

项目主页:https://angular-ui.github.io/bootstrap/

通常来讲,需要引入AngularJS,bootstrap.css。


1.tooltip

angular已经封装好了tooltip这个指令。

<button tooltip='some words to show when arrow hovers'>button</button>

微笑问:hover效果如何在chrome中看详情?

答:鼠标放上去,待tooltip出现后右击,然后在“Elements”视图中查看即可。见图1-1


图1 -1  tooltip元素审查

微笑问:当内容展示过多,被截断怎么办?

答:可尝试直接修改bootstrap.css。由图1-1中可以看到应该修改的是 ".tooltip-inner",见下:

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background-color: #000;
  border-radius: 4px;
  /*add one line by yichu*/
  word-wrap: break-word;
}



版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章