<style>
.info {position:relative;background:#fff;color:#666; text-decoration:none;font-size:12px;width:150px;text-align:center;border:1px solid #ccc;height:25px;line-height:25px;}/*設定連結的屬性,一定要設定為relative才能使提示層跟著連結走*/
.info:hover {background:#eee;color:#333;}
.info span {display: none }/*設定正常下的span為隱藏狀態*/
.info:hover span /*設定hover下的span屬性為呈現狀態,並設定提示層的位置*/{display:block;position:absolute;top:30px;left:60px;width:130px;
border:1px solid #ff0000; background:#fff; color:#000;padding:5px;text-align:left;}
</style>
<body>
<a class="info" href="http://www.achome.cn">www.achome.cn<span>這是我的個人blog，裡面有一些網站設計和製作的東東</span></a>
<a class="info" href="http://www.achome.cn">www.achome.cn<span>這是我的個人blog，裡面有一些網站設計和製作的東東，希望大家常來交流</span></a>
<a class="info" href="http://www.achome.cn">www.achome.cn<span>這是我的個人blog，裡面有一些網站設計和製作的東東，希望大家常來交流</span></a>
<a class="info" href="http://www.achome.cn">www.achome.cn<span>這是我的個人blog，裡面有一些網站設計和製作的東東，希望大家常來交流</span></a>
<a class="info" href="http://www.achome.cn">www.achome.cn<span>這是我的個人blog，裡面有一些網站設計和製作的東東，希望大家常來交流</span></a>
</body>
效果示範http://www.blueidea.com/tech/web/2006/4171.asp
