<title>无标题文档</title>
<style type="text/css">
a.tooltip {
position:relative;
}
a.tooltip span{
display: none;
}
a.tooltip:hover span {
display:block;
position:absolute;
top:1.0em;
left:2em;
padding: 0.2em 0.6em;
border: 1px solid #996633;
background-color:#ffff66;
color:#000;
text-decoration:none;
}
</style>
</head>
<body>
<p>
<a href="fixed_absolute.jsp" class="tooltip">
Andy Budd<span>(My web site)/span>
</a>
is a web developer based in Brighton England.
</p>
</body>
</html>
上面的是使用css在连接 Andy Budd 下面弹出解释内容 My web site,
当鼠标位于其上时 my web site 会分成三行显示,为什么a.tooltip:hover span中
不设置span 的width属性时会出现上面的情况??span在鼠标悬浮时已是block元素
应该在一行显示啊????
------解决方案--------------------
你可以加上
white-space: nowrap;
修改这种行为。
可能有默认值或者容器的宽度比较小