您的位置:首页 > 其它

元素title属性在不同浏览器下的行为表现

2012-05-21 16:01 776 查看
元素的title属性常用于提示。但是不同浏览器下title的表现行为是不一样的。


行为1-显示:

各大浏览器基本上无大差异,鼠标移到元素上后即显示。


行为2-消失:

(下面操作行为假设鼠标一直在带title属性的目标元素内部进行)

FF,出现title时如果不移动鼠标title提示不会消失,移动鼠标后title消失。消失后再次移动鼠标提示不会再次出现

IE、Safari和Chrome,出现title提示大约5秒后自动消失。IE和Safari中,提示消失后再次移动鼠标提示不会再次出现,Chrome则会再次出现。


行为3-子元素title与父元素title

各大浏览器中,如果子元素title不为空,则子元素的title属性覆盖父元素的title。如果子元素title为空,除IE外其他浏览器自动显示父元素title,IE不会显示父元素的title。

总体来说,表现最好的为chrome,最差者为ie。

例如

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
	</head>
	<body>

<UL>
<LI>
<DIV>
<A title=IE这里不出现提示 href="#" >
<SPAN class="icon aaaa"> </SPAN><SPAN id=2921 class=nav>没有提示出现</SPAN></A>
</DIV>
</LI>
<LI>
<DIV>
<A title=我想要出现的提示 href="#">
有提示出现</A>
</DIV>
</LI>
</UL>
		</body>
	</html>


要想IE出现提示,则要在“#2921”上加title属性
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: