本文實例講述了div+css實現仿豬八戒首頁導航菜單效果。分享給大家供大家參考。具體如下:
這是一款仿豬八戒2010年首頁的網頁導航菜單,藍色風格,非常漂亮大氣、簡潔專業,在此推薦給大家。菜單上有一個標記,指引當前的位置,也是本菜單的亮點。用CSS究竟是如何實現的呢?那麼就請一起看代碼吧。
先來看看運行效果截圖:
具體代碼如下:
代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>仿2010豬八戒首頁導航菜單</title>
<style type="text/css">
<!--
body{font:12px 微軟雅黑,Verdana,Tahoma;}
*{padding:0px;margin:0px;}
* li{list-style:none;}
a{text-decoration:none;color:#20537A;}
a:hover{text-decoration:underline;}
.clearfix:after {
content: "