亚洲一级无码在线视频,2023国产品精品在线不卡

　CSS 菜單舉一反三

作者：leimtessa　時間： 2006-06-23　文檔類型：原創(chuàng)　來自：藍(lán)色理想

舉一：

運(yùn)行代碼框
<!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" lang="zh-CN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css菜單演示</title> <style type="text/css">  </style> <script type=text/javascript><![CDATA[//><!]]></script> </head> <body> <ul id="nav"> <li><a href="#">產(chǎn)品介紹</a> <ul> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> </ul> </li> <li><a href="#">服務(wù)介紹</a> <ul> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二服務(wù)二</a></li> <li><a href="#">服務(wù)二服務(wù)二服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> </ul> </li> <li><a href="#">成功案例</a> <ul> <li><a href="#">案例三</a></li> <li><a href="#">案例</a></li> <li><a href="#">案例三案例三</a></li> <li><a href="#">案例三案例三案例三</a></li> </ul> </li> <li><a href="#">關(guān)于我們</a> <ul> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四111</a></li> </ul> </li> <li><a href="#">在線演示</a> <ul> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示演示演示演示</a></li> </ul> </li> <li><a href="#">聯(lián)系我們</a> <ul> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> </ul> </li> </ul> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

反三：

變成水平方向

運(yùn)行代碼框
<!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" lang="zh-CN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css菜單演示</title> <style type="text/css">  </style> <script type=text/javascript><![CDATA[//><!]]></script> </head> <body> <ul id="nav"> <li><a href="#">產(chǎn)品介紹</a> <ul> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> </ul> </li> <li><a href="#">服務(wù)介紹</a> <ul> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二服務(wù)二</a></li> <li><a href="#">服務(wù)二服務(wù)二服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> </ul> </li> <li><a href="#">成功案例</a> <ul> <li><a href="#">案例三</a></li> <li><a href="#">案例</a></li> <li><a href="#">案例三案例三</a></li> <li><a href="#">案例三案例三案例三</a></li> </ul> </li> <li><a href="#">關(guān)于我們</a> <ul> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四111</a></li> </ul> </li> <li><a href="#">在線演示</a> <ul> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示演示演示演示</a></li> </ul> </li> <li><a href="#">聯(lián)系我們</a> <ul> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> </ul> </li> </ul> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

彈簧式

運(yùn)行代碼框
<!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" lang="zh-CN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css菜單演示</title> <style type="text/css">  </style> <script type=text/javascript><![CDATA[//><!]]></script> </head> <body> <ul id="nav"> <li><a href="#">產(chǎn)品介紹</a> <ul> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> </ul> </li> <li><a href="#">服務(wù)介紹</a> <ul> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二服務(wù)二</a></li> <li><a href="#">服務(wù)二服務(wù)二服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> </ul> </li> <li><a href="#">成功案例</a> <ul> <li><a href="#">案例三</a></li> <li><a href="#">案例</a></li> <li><a href="#">案例三案例三</a></li> <li><a href="#">案例三案例三案例三</a></li> </ul> </li> <li><a href="#">關(guān)于我們</a> <ul> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四111</a></li> </ul> </li> <li><a href="#">在線演示</a> <ul> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示演示</a></li> <li><a href="#">演示演示演示演示演示</a></li> </ul> </li> <li><a href="#">聯(lián)系我們</a> <ul> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系聯(lián)系</a></li> </ul> </li> </ul> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

二級菜單為水平的

運(yùn)行代碼框
<!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" lang="zh-CN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css菜單演示</title> <style type="text/css">  </style> <script type=text/javascript><![CDATA[//><!]]></script> </head> <body> <ul id="nav"> <li><a href="#">產(chǎn)品介紹</a> <ul> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> </ul> </li> <li><a href="#">服務(wù)介紹</a> <ul> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二服</a></li> <li><a href="#">服務(wù)二服</a></li> <li><a href="#">服務(wù)二</a></li> </ul> </li> <li><a href="#">成功案例</a> <ul> <li><a href="#">案例三</a></li> <li><a href="#">案例</a></li> <li><a href="#">案例三案</a></li> <li><a href="#">案例三案</a></li> </ul> </li> <li><a href="#">關(guān)于我們</a> <ul> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四111</a></li> </ul> </li> <li><a href="#">在線演示</a> <ul> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> </ul> </li> <li><a href="#">聯(lián)系我們</a> <ul> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> </ul> </li> </ul> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

還有一種

運(yùn)行代碼框
<!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" lang="zh-CN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>css菜單演示</title> <style type="text/css">  </style> <script type=text/javascript><![CDATA[//><!]]></script> </head> <body> <ul id="nav"> <li><a href="#">產(chǎn)品介紹</a> <ul> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> <li><a href="#">產(chǎn)品一</a></li> </ul> </li> <li><a href="#">服務(wù)介紹</a> <ul> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二</a></li> <li><a href="#">服務(wù)二服</a></li> <li><a href="#">服務(wù)二服</a></li> <li><a href="#">服務(wù)二</a></li> </ul> </li> <li><a href="#">成功案例</a> <ul> <li><a href="#">案例三</a></li> <li><a href="#">案例</a></li> <li><a href="#">案例三案</a></li> <li><a href="#">案例三案</a></li> </ul> </li> <li><a href="#">關(guān)于我們</a> <ul> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四</a></li> <li><a href="#">我們四111</a></li> </ul> </li> <li><a href="#">在線演示</a> <ul> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> <li><a href="#">演示演示</a></li> </ul> </li> <li><a href="#">聯(lián)系我們</a> <ul> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> <li><a href="#">聯(lián)系聯(lián)系</a></li> </ul> </li> </ul> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

本文鏈接：http://m.95time.cn/tech/site/2006/3658.asp　

出處：藍(lán)色理想
責(zé)任編輯：moby

◎進(jìn)入論壇網(wǎng)站綜合、網(wǎng)頁制作版塊參加討論

相關(guān)文章

更多相關(guān)鏈接

純CSS去除按鈕以及鏈接點(diǎn)擊時虛線

CSS像素圖制作攻略

彈性+固寬布局

CSS3 備受期待的 8 大功能

CSS Sprites + 圓角


關(guān)鍵字搜索	常規(guī)搜索	推薦文檔
熱門搜索：CSS Fireworks 設(shè)計(jì)比賽網(wǎng)頁制作 web標(biāo)準(zhǔn) 用戶體驗(yàn) UE photoshop Dreamweaver Studio8 Flash 手繪 CG

站點(diǎn)最新

站點(diǎn)最新列表

周大�！熬�•自然”設(shè)計(jì)大賽開啟

國際體驗(yàn)設(shè)計(jì)大會7月將在京舉行

中國國防科技信息中心標(biāo)志征集

云計(jì)算如何讓安全問題可控

云計(jì)算是多數(shù)企業(yè)唯一擁抱互聯(lián)網(wǎng)的機(jī)會

阿里行云

云手機(jī)年終巨獻(xiàn)，送禮標(biāo)配299起

阿里巴巴CTO王堅(jiān)的"云和互聯(lián)網(wǎng)觀"

1499元買真八核云OS雙蛋大促

首屆COCO桌面手機(jī)主題設(shè)計(jì)大賽

欄目最新

欄目最新列表

淺談JavaScript編程語言的編碼規(guī)范

如何在illustrator中繪制臺歷

Ps簡單繪制一個可愛的鉛筆圖標(biāo)

數(shù)據(jù)同步算法研究

用ps作簡單的作品展示頁面

CSS定位機(jī)制之一:普通流

25個最佳最閃亮的Eclipse開發(fā)項(xiàng)目

Illustrator中制作針線縫制文字效果

Photoshop制作印刷凹凸字體

VS2010中創(chuàng)建自定義SQL Rule

中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx