在写bootstarp中发现的几个小样式问题,记录以后可能用的到

1.有时候我们想要超过td长度后自动显示省略号,我们会使用

table {
table-layout: fixed;
} table td {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

这样在使用tooltip时就会出现布局出差的情况。

添加

/*处理tooltip被上属性影响*/
.tooltip-inner {
white-space: initial;
text-align: left;
}

即可解决

2.有时候我们想要tooltip提示的内容里支持 html,但发现默认是不可用的。

添加

data-html='true'

属性即可支持

另: data-html='true'个属性加上后,上述的第一个布局问题即使不添加white-space: initial;也可以解决了~~~~surprise !

bootstarp 样式细节(tooltip布局)的更多相关文章

  1. .Net数据集导出到Excel样式细节---------------摘自别人的

    .Net数据集导出到Excel样式细节 本文的目的是总结一些在做Excel导出功能时需要注意的样式细节.使用环境是Asp.Net,数据集的形式是Html Table,Excel还是识别一些CSS代码的 ...

  2. HTML_css样式表 样式属性 格式布局

    CSS(Cascading Style Sheet,叠层样式表),作用是美化HTML网页. /*注释区域*/此为注释语法 一.样式表 (一)样式表的分类 1.内联样式表 和HTML联合显示,控制精确, ...

  3. (day44)css样式、css布局

    目录 一.css样式 (一)文字样式 (1)文字字体font-family (2)字体大小font-size (3)字体粗细font-weight (4)字体颜色color (二)文本样式 (1)文字 ...

  4. 移动端和pc端公用样式及rem布局

    一:移动端准备工作<meta name="viewport" content="width=device-width, initial-scale=1.0, max ...

  5. 浅谈Android样式开发之布局优化

    引言 今天我们来谈一下Android中布局优化常用的一些手段.官方给出了3种优化方案,分别是</include>.</viewstub>.</merge>标签,下面 ...

  6. 用div和css样式控制页面布局

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  7. WPF ScrollViewer(滚动条) 自定义样式表制作 再发一套样式 细节优化

    艾尼路 出的效果图 本人嵌套 WPF ScrollViewer(滚动条) 自定义样式表制作 图文并茂 WPF ScrollViewer(滚动条) 自定义样式表制作 (改良+美化) 源代码

  8. JS for循环有关变量类型的问题/魔兽世界样式的tooltip

    <script> var num = 100; for (var i=num-5;i<num+5;i++){ // console.log(typeof(i)); console.l ...

  9. 第10章 布局样式相关-伸缩布局(Flexible Box)

    伸缩布局(一) CSS3引入了一种新的布局模式--Flexbox布局,即伸缩布局盒模型(Flexible Box),用来提供一个更加有效的方式制定.调整和分布一个容器里项目布局,即使它们的大小是未知或 ...

随机推荐

  1. Blog Starting...

    30出头,开始Blog记录学习生活的点滴,待40时再回来一看.

  2. JMeter中的关联-正则表达式提取(1)

    运用Jmeter正则提取器,可以从请求的响应结果中取到需要的内容,从而实现关联. jmeter之关联 的个人理解: 关联是请求与请求之间存在数据依赖关系,需要从上一个请求获取下一个请求需要回传回去的数 ...

  3. FileSeek文件内容搜索工具下载

    Windows 内建的搜索功能十分简单,往往不能满足用户的需要.很多的第三方搜索工具因此诞生,比如 Everything,Locate32等. 而FileSeek也是一款不错的搜索工具,其不同于其他搜 ...

  4. java 常见下载合集

    J2SE SDK (JDK): Windows: http://download.oracle.com/auth/otn-pub/java/jdk/6u25-b06/jdk-6u25-windows- ...

  5. 使用python实现栈和队列

    1.使用python实现栈: class stack(): def __init__(self): self.stack = [] def empty(self): return self.stack ...

  6. 网站迁移时候,发现<head>内容都到body里了

    遇到的问题截图如下: 这个是编码问题,需要把所有涉及的文件保存成UTF-8 without BOM,手动的话可以用notepad++ 如果网站支持php,这边提供了一个php的脚本(clearBom. ...

  7. HDU5754 Life Winner Bo(博弈)

    题目 Source http://acm.hdu.edu.cn/showproblem.php?pid=5754 Description Bo is a "Life Winner" ...

  8. curl/wget 测试http请求的响应头信息

    1. wget –debug wget可以使用debug信息来查看信息头,如下: [root@localhost ~]# wget --debug http://192.168.1.101:8080/ ...

  9. 20161007 NOIP 模拟赛 T1 解题报告

    排序 3.1 题意描述 众所周知,熟练掌握至少一种排序算法是参加NOIP的必备技能.常见的排序算法有冒泡 排序.归并排序.快速排序.奇偶排序.猴子排序.梳排序.鸡尾酒排序.臭皮匠排序等. 在这里,介绍 ...

  10. 【poj2828】Buy Tickets

    Description Railway tickets were difficult to buy around the Lunar New Year in China, so we must get ...