1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 5 <title>天天生鮮</title> 6 7 <script type="text/javascript" src="../static/js/jquery-1.12.4.min.js"></script> 8 <script type="text/javascript"> 9 $(function(){ 10 $('.left_menu_con li').click(function(){ 11 $(this).children('a').addClass('active').parent().siblings().children('a').removeClass('active'); 12 //alert($(this).children('a').parent().html()); 13 }) 14 }) 15 </script> 16 <style type="text/css"> 17 .left_menu_con{ 18 width:200px; 19 float:left; 20 } 21 22 .left_menu_con h3{ 23 font-size:16px; 24 line-height:40px; 25 border-bottom:1px solid #ddd; 26 text-align:center; 27 margin-bottom:10px; 28 } 29 30 .left_menu_con ul li{ 31 line-height:40px; 32 text-align:center; 33 font-size:14px; 34 } 35 36 .left_menu_con ul li a{ 37 color:#666; 38 } 39 40 .left_menu_con ul li .active{ 41 color:#ff8800; 42 font-weight:bold; 43 } 44 </style> 45 46 </head> 47 48 <body> 49 50 <div class="main_con clearfix"> 51 <div class="left_menu_con clearfix"> 52 <h1>用戶中心</h1> 53 <ul> 54 <li><a href="#" class="active">個人信息</a></li> 55 <li><a href="#">全部訂單</a></li> 56 <li><a href="#">收貨地址</a></li> 57 </ul> 58 </div> 59 </div> 60 61 </body> 62 </html>
