以上的連結示範基本的導覽結構,此結構使用以 CSS 設定樣式的項目清單。請以此做為起點,然後修改屬性來產生您獨有的外觀。如果需要飛出選單,請使用 a Spry menu、menu widget from Adobe's Exchange 或多種其他的 Javascript 或 CSS 解決方案自行建立。

如果想要將導覽列於頂端,只需將 ul.nav 移到頁面頂端,然後重新建立樣式設定即可。

說明

請注意,這些版面的 CSS 都有詳細的註解。如果您是在「設計」檢視中進行大部分的作業,可以看一下程式碼來取得有關使用固定版面 CSS 的提示。您可以在啟動您的網站之前,將這些註解移除。有關這些 CSS 版面所使用的技巧之詳細資訊,請至 Adobe 開發人員中心閱讀本文 - http://www.adobe.com/go/adc_css_layouts。您可以在啟動您的網站之前,將這些註解移除。有關這些 CSS 版面所使用的技巧之詳細資訊,請至 Adobe 開發人員中心閱讀本文 - http://www.adobe.com/go/adc_css_layouts

清除方法

因為所有的欄都是浮動的,所以這個版面會在 .footer 規則中使用 clear:both 宣告。這項清除技巧可強制 .container 辨識欄結束的位置,以顯示放置在 .container 上的任何邊框或背景顏色。如果您的設計需要您從 .container 移除 .footer,就需要使用其他的清除方法。最可靠的方法是在最後的浮動欄之後 (但在 .container 結束之前) 加入 <br class="clearfloat" /> or <div class="clearfloat"></div>,這樣就會產生相同的清除效果。

商標取代

在此版面的 .header 中,會在您要放置商標的位置使用影像預留位置。建議您移除該預留位置,並使用自己的連結商標加以取代。

請注意,如果要使用「屬性」檢視窗使用 SRC 欄位導覽到商標影像 (而不是移除並取代預留位置),則必須將行內背景和顯示屬性移除。這些行內樣式只會在瀏覽器中用來顯示商標預留位置,以便達到示範的目的。

若要移除行內樣式,請確定「CSS 樣式」面板已設定為「目前」。選取該影像,然後在「CSS 樣式」面板的「屬性」窗格中,以滑鼠右鍵按一下顯示及背景屬性並加以刪除 (當然,您也可以直接到程式碼中刪除影像或預留位置的行內樣式)。

背景

就本質而言,任何 Div 上的背景顏色都只會顯示內容的長度。這代表如果您使用背景顏色或邊框來建立側欄,側欄將無法延伸整個頁尾的寬度,而會停止在內容結束處。如果 .content Div 總會包含較多的內容,您就可以在 .content Div 上放置邊框,將其與欄分隔。