当鼠标悬停在缩写和缩写词上时就会显示完整内容,Bootstrap 实现了对 HTML 的 <abbr> 元素的增强样式。缩略语元素带有 title 属性,外观表现为带有较浅的虚线框,鼠标移至上面时会变成带有“问号”的指针。如想看完整的内容可把鼠标悬停在缩略语上, 但需要包含 title 属性。

基本缩略语

如想看完整的内容可把鼠标悬停在缩略语上, 但需要为 <abbr> 元素设置 title属性。

attr

<abbr title="attribute">attr</abbr>

首字母缩略语

为缩略语添加 .initialism 类,可以让 font-size 变得稍微小些。

HTML

<abbr title="HyperText Markup Language" class="initialism">HTML</abbr>

—–下面有个“顶”字,你懂得O(∩_∩)O哈哈~

—–乐于分享,共同进步!

—–更多文章请看:http://blog.csdn.net/duruiqi_fx


Bootstrap3 排版-缩略语的更多相关文章

  1. Bootstrap3 排版-页面主体

    Bootstrap 将全局 font-size 设置为 14px,line-height 设置为 1.428.这些属性直接赋予 元素和所有段落元素.另外,<p> (段落)元素还被设置了等于 ...

  2. Bootstrap3 排版-列表

    无序列表 排列顺序无关紧要的一列元素. <ul> <li>...</li> </ul> 有序列表 顺序至关重要的一组元素. <ol> < ...

  3. Bootstrap3 排版-引用

    在你的文档中引用其他来源的内容. 默认样式的引用 将任何 HTML 元素包裹在 <blockquote> 中即可表现为引用样式.对于直接引用,我们建议用 <p> 标签. Lor ...

  4. Bootstrap3 排版-地址

    让联系信息以最接近日常使用的格式呈现.在每行结尾添加 可以保留需要的样式. Twitter, Inc. 795 Folsom Ave, Suite 600 San Francisco, CA 9410 ...

  5. Bootstrap3 排版-改变大小写

    通过这几个类可以改变文本的大小写. <p class="text-lowercase">Lowercased text.</p> <p class=& ...

  6. Bootstrap3 排版-对齐

    通过文本对齐类,可以简单方便的将文字重新对齐. Left aligned text. Center aligned text. Right aligned text. Justified text. ...

  7. Bootstrap3 排版-内联文本元素

    标记文本 突出显示的文本由于其相关性在另一个上下文中,使用<mark>标记. You can use the mark tag to highlight text. You can use ...

  8. Bootstrap3 排版-标题

    HTML 中的所有标题标签,<h1> 到 <h6> 均可使用.另外,还提供了 .h1 到 .h6 类,为的是给内联(inline)属性的文本赋予标题的样式. h1. Boots ...

  9. Bootstrap 一. 排版样式(内联文本元素,对齐,大小写,缩略语,地址文本,引用文本,列表排版 ,代码 )

    第 2 章 排版样式 在 h1 ~ h6 元素之间,还可以嵌入一个 small 元素作为副标题 <h1>Bootstrap 框架 <small>Bootstrap 小标题< ...

随机推荐

  1. javax.el.ELException: Error reading [name] on type [com.news.entity.Topic_$$_javassist_1]异常

    异常如下: 异常分析:从message中可以看出,错误是读取异常,属性是name,路径是com.news.entity.Topic,此错误是使用Hibernate时,由于Hibernate还没有去数据 ...

  2. C++ namespace的作用

    namespace:命名空间或者叫名字空间,传统的c++只有一个全局的namespace,但是由于现在的程序规模越来越大,程序的分工越来越细,全局作用域就变得越来越拥挤,每个人都可能使用相同的名字来实 ...

  3. node.js使用node-xlsx读写数据

    下面是包含了读写的样例: var xlsx = require('node-xlsx'); var fs = require('fs'); // 读取文件内容 var data = xlsx.pars ...

  4. [LeetCode] Detect Capital 检测大写格式

    Given a word, you need to judge whether the usage of capitals in it is right or not. We define the u ...

  5. Jmeter启动问题总结

    下载下来的jmeter文件,双击jmeter.bat文件打开的时候,系统提示如下: 查询安装的环境,java的jdk存在,并且版本在1.7以上,详情如下: 在环境变量PATH中添加:%SystemRo ...

  6. [自用]多项式类数学相关(定理&证明&板子)

    写在前面 由于上一篇总结的版面限制,特开此文来记录 \(OI\) 中多项式类数学相关的问题. 该文启发于Miskcoo的博客,甚至一些地方直接引用,在此特别说明:若文章中出现错误,烦请告知. 感谢你的 ...

  7. [NOI 2001]炮兵阵地

    Description 司令部的将军们打算在N*M的网格地图上部署他们的炮兵部队.一个N*M的地图由N行M列组成,地图的每一格可能是山地(用“H” 表示),也可能是平原(用“P”表示),如下图.在每一 ...

  8. Codeforces Round #464 F. Cutlet

    Description 题面 有\(2*n\)的时间,去煎一块肉,肉有两面,你需要在特定的时间内翻转,使得每一面都恰好煎了\(n\)分钟,你有\(k\)次翻转的机会,每一次表示为一段时间 \([L_i ...

  9. ●BZOJ 2154 Crash的数字表格

    题链: http://www.lydsy.com/JudgeOnline/problem.php?id=2154 题解: 莫比乌斯反演. 题意还是很清楚的,就不赘述了. 显然有 $ANS=\sum_{ ...

  10. hdu 5895 广义Fibonacci数列

    Mathematician QSC Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Othe ...