在导出表中数据放进页面table中时,经常会遇到这么一个问题:数据字符串太长,我们不需要展示全部,鼠标经过时toast全部信息,类似于<a>标签的title功能;
于是可以这么写你的文本
<a title="石兰是个美腻的菇凉">石兰</a>
带来的问题是这么写是一个超链接,而想要的展示效果只是普通文本;
第一反映是重写<a>标签的样式
<style type="text/css">
a:link{color:#000000}
</style>
如果页面没有引入其他框架,这么写是没有问题的;
问题是用的是datatable这么一个神奇的方法,即使你事先定义了<a>标签的样式,也会在加载的时候重新渲染,是的,有先后顺序;
问题到这里似乎卡住了,其实这中间还遇到一个问题,我只是想这一段的<a>标签样式发生变化,而不希望页面上所有的<a>标签样式改变;
于是可以自己定义一个样式:
<style type="text/css">
.mymarkofa a:link{color:#000000} visited{color:#000000} hover{color:#000000} active{color:#000000}
</style>
//注 这里的link visited hover active务必在一行中写完
在代码中引用自己定义的样式就可以了
<div class="mymarkofa">
<a title="石兰是个美腻的菇凉">石兰</a>
</div>
回头再看自己定义的样式,其实我们定义的是一个<div>标签,只是我们把这个<div>标签中的<a>的样式重写了;
css中的各类标签的继承关系,似乎没有java那么严格,或者说并不严格地区分父类和子类,你可以任性地组织各个标签之间的关系;
面向对象的思想真的很重要,如果能想明白这一点,那么回头再看我们遇到的问题,事情真的需要这么复杂么?
我们需要的是<a>标签中title功能、展示的是普通文本。
既然如此,我们按着本该发生的方式写代码就是了:
<a title="石兰是个美腻的菇凉"><span style='color:#000000'>石兰<span></a>
是的,在文本中加上一个标签便是了,再给这个标签的样式赋值。
其实需要理解的是标签渲染的次序,如果明白标签渲染的次序,上面这段html语言很容易理解。
其实没必要这么复杂,你也可以不用<a>标签的title功能,自己直接定义鼠标经过的方法,最后引用这个方法,弱弱的LZ暂时没有去看css源码的想法,只能偷懒喽
分享到:
相关推荐
attr() 函数获取html格式下多个<a >标签,并且根据不同id 调用不同的function()函数 给<a>标签添加id ,根据不同id 获取属性病赋值
<IMG>标签 <br><br>11.4.3 图像类型 <br><br>11.4.4 与图像相关的问题 <br><br>11.4.5 分割图像 <br><br>11.4.6 Web中基于矢量的艺术: Flash <br><br>11.5 背景图像 <br><br>11.6 小结 <br><br>第12章 利用GUI特性...
<IMG>标签 <br><br>11.4.3 图像类型 <br><br>11.4.4 与图像相关的问题 <br><br>11.4.5 分割图像 <br><br>11.4.6 Web中基于矢量的艺术: Flash <br><br>11.5 背景图像 <br><br>11.6 小结 <br><br>第12章 利用GUI特性...
-- <a href=""></a> -->超链接标签(用于从一个页面链接到另一个页面) <br> 文本超链接 <br> <a href="https://www.baidu.com/">百度</a> <div> <!-- <a href=" 不写值 ">百度</a> -->空链接 <br> <a href=""></...
ballon_tip_src.zip<br>一个很酷的TOOLTIP(4KB)<END><br>80,grid_strl_src.zip<br>MFC网格控件(57KB)<END><br>81,grid_strl_demo.zip<br>MFC网格控件演示程序(115KB)<END><br>82,tabwnd.zip<br>标签视(37KB)<END><br...
第一回合 32<br>4.5 IPv6,第二回合 32<br>第二部分 IPv6细节<br>第5章 IPv6的成型 33<br>5.1 IPv6 33<br>5.1.1 变化概述 33<br>5.1.2 包头结构 35<br>5.1.3 IPv4与IPv6的比较 36<br>5.1.4 流标签 37<br>5.1.5 业务...
65、<pre> 定义预格式化文本。 66、<progress> 定义任何类型的任务的进度。 67、<q> 定义短的引用。 68、<rp> 定义非ruby显示的内容。 69、<rt> 定义 ruby 注释的解释。 70、 <ruby> 定义 ruby 注释。 71、<script> ...
短消息,只转收件箱<br> <br> <br> 已通过测试版本:0803版及其Hack版、1201版及其Hack版、4.01版及其Hack版<br> <br> <br> <br> <br> <br> 1.6版对其上一个版本所做的改善如下:<br> <br> a.用户数据部分: 增加头衔...
<a>标签,属性是它的“装备”,可以给它添加功能,如href属性可以使它在被点击的情况下跳到对应网址 2.1重要标签 2.1.1表格标签<table>,常常用于显示内容 表格标题:<caption></caption> 表格头:<thead><tr><th...
<br>Safari 2 3575ms 475ms 753% <br>Opera 9.1 3196ms 326ms 980% <br>Average improvement: 867% <br><br>下表为jQuery1.1.3与常用的一些JS库选择器的对比:<br>Browser Prototype jQuery Mootools Ext Dojo <br>...
背景:后端返前端html格式的数据,前端用v-html解析渲染,如:<a></a>,a标签能成功渲染,但其绑定的事件无法触发。 原因:vue没有将其作为vue的模板解析渲染 解决方案:不用v-html而是component模板编译 上干货: ...
<li>列表项1</li> <li>列表项2</li> <li>列表项3</li> ...... </ol> 有序列表 列表标签 代码如下: 有序列表 列表标签 有序列表相关的属性 属性 属性值 描述 type 1(默认) 项目符号显示为数字1 2 3… a或A 项目...
每种设备可能会在<Device>标签下面。 一个示例格式可能如下: Xml <Database> <Device> <DeviceName>...</DeviceName> <FlashSize>...</FlashSize> <Core>...</Core> <!-- more details here --> </Device> ...
<ul><li><a class="selected">1</a></li> <li><a href="search-cat-4-page-2.html" class="unselected">2</a></li> <li><a href="search-cat-4-page-3.html" class="unselected">3</a></li> <li><a href="search-cat...
<a href="">aaaaaaaaa</a>javascript <p><img src="">alert('a')<img src="abc.jpg"><img></p> <p>Test</p> 嗯,非常安全。然后,又有一个疑问了,是应该将用户的输入过滤之后写入数据库呢?还是在输出界面...
--temp:loop--><br/> <div id="pagelist">{--temp:page for=index_list--}</div><br/> 包含处理,名称为模版名称<br/> {--include:archives--}<br/>标签<br/> 全局标签 <br/> {--S:PATH--},当前程序路径 <br/> {--S:...
*.raw<br>可以将它们转换为:<br>3GP/3G2, MP4, AVI, WMV, MP3, M4A, AAC, WMA, AMR 等格式<br>特色功能:<br>∷支持视频分割,帮助您去粗取精,可以只保留你最喜爱的片段<br>∷允许导入外挂的各种字幕文件、支持...
学习了下bootstrap,刚好在用分页,就自己写了一个分页,然后... <li><a>«</a></li> <li class=active><a>1</a></li> <li><a>2</a></li> <li><a>3</a></li> <li><a>4</a></li> <li><a>5</a></li> <li><a>»<
v<MAJ>.<MIN>.<PATCH>-[<NEXT>|<SNAPSHOT>]-[<COMMIT_COUNT>]/<HASH> The -SNAPSHOT suffix is used when the NEXT version string numbers are known, to denote a snapshot of that future version. The -NEXT ...
并且读取中文标签经常会出现乱码,由于YOYOPlayer是国人开发的,所以对中文的支持绝对可以放心,并且可以自定义标签的读取和写入编码.<br> 支持snd,aifc,aif,wav,au,mp1,mp2,mp3,ogg,spx,flac,ape,mac等音频格式音乐。...