使用html和css更改超链接的工具提示颜色 [英] Changing the tooltip color for a hyperlink using html and css

问题描述

我需要更改工具提示的背景颜色，该提示将显示在超链接上的鼠标悬停上（适用于firefox和ie6及更高版本）。是否有任何基于CSS和HTML的脚本（没有jQuery或JavaScript）。

I need to change the background color of the tool tip which will show on mouse over on a hyperlink (for using in firefox and ie6 & higher). Is there any css and html based scripts (without jQuery or javascript) for doing this.

我知道背景颜色实际上是根据操作系统属性。

I came to know that the background color is actually as per the OS properties.

推荐答案

我这样做：

I do it like this:

This is text before the 
<a href="#" class="TT-container">
  tool tip link<span class="TT-value">tool tip text</span></a> 
and this is after it.

.TT-container {
  position: relative;
  border-bottom : 1px dashed #999999;
}
.TT-value {
  display: none;
  background-color: #f8e7c7;
  color: black;
  border: 1px solid black;
  padding: 3px 5px 3px 5px;
  white-space: pre;
  text-decoration: none;
  z-index: 99;
}
.TT-container:hover {
  font-size: 100%;                          /* fix an IE bug */
  z-index: 2;
}
.TT-container:hover .TT-value {
  position: absolute;
  top: 5px;
  left: 20px;
  display: inline;
}

这篇关于使用html和css更改超链接的工具提示颜色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！