tooltip.css-2.0文档

2018-06-24 02:22:31来源:未知 阅读 ()

新老客户大回馈,云服务器低至5折

 tooltip.css

纯CSS鼠标提示工具。

v. 2.0.0

更新日期:2018.4.12

预览DEMO。

 

 安装:

只需在页面中引入"tooltip.css"或“tooltip.min.css”文件即可。

如:

<link rel="stylesheet" href="css/tooltip.css" />

<--or(或)-->

<link rel="stylesheet" href="css/tooltip.min.css" />

 

 使用:

1、在需要显示提示的标签上添加 data-tooltip 属性和 data-tooltip-text 两个属性;

2、data-tooltip 属性值代表方向,可以设置为“left”、“right”、“top”、“bottom”、“top-left”、“top-right”、“bottom-left”和“bottom-right”中的任意一个值;

3、data-tooltip-text 属性存放的是显示所需的文本。

如:

<p data-tooltip="left" data-tooltip-text="左边提示">左边提示</p>    

 

文本换行:在要换行的地方添加**&#010**字符

如:

<p data-tooltip="right" data-tooltip-text="右边提示样式 &#010 这个是右边提示样式哦 &#010 css3提示样式">右边提示</p>

 

兼容性:
1)IE9、IE9+

2)Firefox

3)Chrome

4)360 Browser

5)Sogou Explorer

标签:

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇:HTML 5+CSS 3网站布局应用教程 (赵振方) 随书光盘 ?

下一篇:用HTML编写迪士尼乐园页面