当前位置： 移动技术网 > IT编程>网页制作>CSS > tooltip.css-2.0文档

tooltip.css-2.0文档

2018年04月20日  | 移动技术网IT编程  | 我要评论

 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

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网