7>css樣式表在frontpage10中的嶄新應用

css在網頁效果處理中一直比較受關注,一般情況下應用css到指定的網頁中可以采取兩種不同的方法,外部風格頁與內部風格定義.

1,外部風格頁

所謂的外部風格頁也就是獨立開來的擴展名為.css的文件,編輯css文件可以在任意的文本處理程序中進行,不過畢竟不少作網頁的新手對css源代碼的編寫還是不太清楚.

或是出于上面的種種考慮吧,在新的frontpage10中提供了css文件的建立模板,你可以根據需要定制自己感興趣的模板樣式.

"view"-"task pane",調出任務面板,單擊上面的"page temples"項,在隨后的"網頁模板"窗口中選中"style sheets"標簽,如圖

列表中提供了12種不同的樣式,選中后,單擊ok,即可查看具體的css代碼信息.建立新的css文件,請選中最上的"normal style sheet"項,然后進入編輯窗口.關于更多的css代碼基礎知識這里就不說了,大家可以查看一下相關的資料.

不過鑒于直接編寫的困難,frontpage10在"樣式編輯"窗口中提供了一個手動設定的工具按鈕,如圖

單擊"a style"按鈕,進入"style"窗口,開始設置不同類型的css樣式,完成后所有設定項目會自動轉化成代碼信息,并按先后順序顯示出來.具體的將在內部風格定義中講到.

完成css文件的創建以后,下一步當然就是用它來格式化網頁了.

進入待格式網頁中,使用菜單"format'-"style sheet link"打開鏈接窗口,如圖

其中"all pages"單選鈕可以將樣式文件應用到網站所有網頁中,而"selected pages"只在當前編輯網頁中使用,一般我們多選擇后者.

單擊"add",在網站根目錄下找到目標css文件的位置.當然你也可以為同一個網頁添加多個css文件對象,不過這時你需要注意他們的前后位置,frontpage會以優先覆蓋的方式來處理其間出現沖突的格式類型.

ok,你會發現當前網頁已經按照css文件里的設置自動格式化好了.是不是很方便.其實使用外部風格頁來格式網頁內容,除了可以統一諸多同類頁的顯示效果外,還有一個重要的原因就是避免了代碼編寫及瀏覽顯示時的重復性,編寫時提高了工作效率,而瀏覽時又加快了速度.

外部風格頁的引入代碼也是非常簡單的,類似下面的形式:

<link rel="stylesheet" type="text/css" href="link.css">