<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{margin:0;padding:0} body{font:12px/1.5 arial} a{display:block;width:100px;color:#333;text-decoration:none} div{height:20px;border-bottom:1px solid #ddd;line-height:20px} dl{position:relative;width:100px;margin-left:200px;background:#f00} dd{display:none;position:absolute;top:20px;left:0;width:100px;background:#f00} .hover dd{display:block} </style> </head> <body> <div> <dl onmouseover="this.className='hover'" onmouseout="this.className=''"> <dt> <a href="#">我的携程</a> </dt> <dd> <a href="#">我的订单</a> <a href="#">我的积分</a> <a href="#">我的票券</a> <a href="#">我的信息</a> </dd> </dl> </div> </body> </html>