例:
<a href="example.com" title="My site"> Link </a>
Run Code Online (Sandbox Code Playgroud)
如何更改"标题"属性.默认情况下,它只有黄色背景和小字体.我想把它变大,改变背景颜色.
是否有CSS方式来设置title属性的样式?
我想在文本中添加工具提示,例如,如果我有这样的代码:
<a href="http://google.com" title="The World's Largest Search Engine!">Google!</a>
Run Code Online (Sandbox Code Playgroud)
鼠标悬停时,我想显示该工具提示。使用title是一个好方法,但是如何设计才能看起来更好呢?任何帮助:
JSFIDDLE
我想为工具提示创建一个自定义 CSS 类,它将包含长度超过 25-30 的字符串。通常这么长的文本不适合工具提示文本区域。
无论如何,是否可以使用Tooltip (ui.bootstrap.tooltip)来执行此操作?就像使用自定义 CSS 类来获得所需的输出一样。
这是简单的 css 工具提示 - Plunker DEMO
这是相同的代码片段:
.tooltip {
position: relative;
display: inline-block;
border-bottom: 1px dotted black;
}
.tooltip .tooltiptext {
max-width:100px;
padding:15px;
min-height:30px;
background:#fff;
visibility: hidden;
border: 1px solid black;
color: #000;
text-align: center;
border-radius: 6px;
/* Position the tooltip */
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltiptext {
visibility: visible;
}Run Code Online (Sandbox Code Playgroud)
<body style="text-align:center;">
<p>Move the mouse over the text below:</p>
<div class="tooltip">Hover over me 1
<span class="tooltiptext">Tooltip …Run Code Online (Sandbox Code Playgroud)添加工具提示的最佳解决方案是<rect>什么?
我用几个<rect>标签创建了SVG地图,我想在鼠标悬停时显示工具提示.使用title属性很好但是有没有选项如何使用CSS/Javascript/jQuery重新设置它还是有更好的选项来添加工具提示?
<svg version="1.1" baseProfile="basic" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 50 50" xml:space="preserve">
<g>
<rect id="1" title="There's some text" x="0" y="0" fill="#666666" width="20" height="20"/>
<rect id="2" title="There's another text" x="30" y="0" fill="#666666" width="20" height="20"/>
</g>
</svg>
Run Code Online (Sandbox Code Playgroud)