TWed2k - 程式開發討論區 - [轉貼] 13styles：CSS多層選單線上產生器

jocosn
白銀驢友

今日心情

．積分： 1386
．精華： 2
．文章： 2945
．收花： 9537 支
．送花： 3671 支
．比例： 0.38
．在線： 1295 小時
．瀏覽： 19041 頁
．註冊： 7455 天
．失蹤： 1457 天

#1 : 2006-7-20 05:03 PM 只看本作者	送花 (0) 送出中...

13styles：CSS多層選單產生器

13styles.com可以讓使用者在線上製作純CSS+XHTML的多層選單（精確地說是主要與次要兩層），理論上共有13種樣式，不過目前只有4種可以選擇。

要使用13styles的服務必須先註冊成為會員，然後透過Create a Menu開始製作選單。

首先，使用者須設定選單名稱，並選擇一款樣式：

步驟二，從右下角選擇選單第一層的選項數量，最多10個，然後按下「ADD NEW」：

步驟三，填入選項名稱（Menu Item Title）、連結網址（Link URL）、連結目標（Target）：

步驟四，為選單加入第二層選項，直接點擊選項的連結進入設定；也可以使用ORDER欄位的箭頭來調整選項的順序：

步驟五，重做步驟二、三來加入第二層選項。

步驟六，可以預覽成品，確定無誤後，按下「Download Source Code」連結，即可下載原始碼檔案。

下載回來的原始碼檔案非常簡單，包含了XHTML檔案、CSS檔案（有for IE的版本）和選單的圖檔。要注意的是，如果選單的選項有使用中文的話，必須將XHTML檔案的文字編碼改為UTF-8才能正常顯示（預設為iso-8859-1，中文會變亂碼）。

利用13styles製作的多層選單可以適用於目前幾種主流的瀏覽器，網站上有詳細的相容性說明表格可供參考。

完成品參考
http://ideagrapes.com/13styles/style4.html

---------------
[使用心得] 步驟二即失敗

[jocosn 在 2006-7-20 05:05 PM 作了最後編輯]

[如果你喜歡本文章，就按本文章之鮮花～送花給作者吧，你的支持就是別人的動力來源]

本文連接

快速回覆