在可視化CSS編輯器方面，GoLive在版本6已經成型，其設計構思甚至成為許多專業CSS編輯器模仿的對象，如眾所周知的TopStyle。近來隨著中文版GoLive的發布，引發了業內網頁制作軟件之爭。面對這個在國內幾乎是一夜之間出現的新面孔，許多人開始關注。 我曾發表過有關GoLive將在網頁制作方面取代DreamWeaver的評論，預計后者將轉型為數據庫開發組件。這是因為DreamWeaver在數據庫方面非常優秀，但在可視化網頁編輯方面早已落后(應該說不曾領先)。只是憑借著中文化優勢占領著國內市場。

在CSS+DIV方式逐漸成為主流網頁結構的今天，一款功能完善使用簡單的CSS編輯器是非常必要的，并且應該融合到網頁制軟件之中，在這方面，GoLive領先同行軟件至少兩年。只是之前由于開發商不關注中文市場而一直不為人知。今天我們就來粗略看一下如何在GoLive中使用CSS編輯器。

1：CSS文件管理

GoLive默認是基于站點的軟件，在建立新站點后將自動產生CSS目錄及一個Basic.css文件。如下圖。如果有多個CSS文件存在，加粗的文件為默認CSS文件。可在列表中右鍵點擊CSS文件設為默認。 建立站點的視頻教程：http://www.99ut.com/tutorial/golive/video/glv002.html (擁有視頻源文件的站點可改為內部指向)

而新建的網頁文件也將默認以鏈接方式使用這個外部CSS文件，這在源代碼視圖中可以看到。

對于已經打開處于編輯狀態的頁面，可長按編輯窗口右端紅色箭頭處的CSS編輯圖標來選擇更改外部CSS文件鏈接。如下圖。

還可以在編輯窗口點擊紅色箭頭處的標頭區，然后選擇其中綠色箭頭處的外部CSS指示圖標(刪除該圖標即脫離該外部CSS文件)，然后在檢查器〖CTRL_1〗調板中按住藍色箭頭處拖出定位線，定位到站點窗口的CSS文件名稱上。

即使在頁面文件未打開的情況下，也可以在站點窗口中選擇文件(可多選)，然后通過CSS調板來更改外部CSS文件鏈接，如下圖就是為photo.html和story.html增加new1.css外部樣式表的過程。此外還可以點擊紅色箭頭處的按鈕來增加。 若要脫離外部CSS樣式文件，可在CSS調板中選擇后點擊紅色箭頭右方的垃圾桶圖標。

2：在頁面中應用樣式

主要使用CSS調板〖CTRL_SHIFT_9〗來完成頁面內容的樣式指定。還可以使用快捷鍵〖CTRL_B〗開啟浮動式CSS調板，每次操作之后浮動調板將消失。 如下圖所示，指定的類型分為四種：內聯樣式(鼠標所選部分)、塊樣式(光標所在文字塊)、p(光標所在段落)、body(全頁面)。如果光標位于一個鏈接之上還將出現a(鏈接樣式)，選擇表格或單元格后還將出現table(表格)和td(表格中的單元格)。

雖然完成指定后編輯窗口中將實時顯示效果，GoLive還是提供了指定預覽功能，鼠標在樣式名稱上懸停將出現浮動預覽窗口(下圖紅框內即是)，預覽的內容包括應用效果和樣式源代碼。根據不同的指定類型，預覽窗口中的應用效果也不同。如下圖所示，在選擇了GoLive CS2文字后，鼠標懸停于內聯樣式上，預覽窗口就顯示所選的文字內容。如果此時鼠標懸停于塊樣式上，預覽窗口文字將顯示為“GoLive CS2中文版”。

3：CSS編輯器

在站點窗口中雙擊css文件就可以開啟樣式編輯器。在開啟的頁面中點擊右上角的CSS編輯按鈕(本篇第3圖所示)也可以開啟編輯器。兩者的區別在于前者是編輯外部樣式文件，后者是編輯自身html樣式表。

現在我們來看一下GoLive的樣式編輯器，分為可視化編輯和提供給代碼狂人使用的源代碼(紅色箭頭處)兩大視圖。并提供了樣式搜索器(綠色箭頭處)，這個看似簡單的搜索其實非常全面，點擊放大鏡處可選擇搜索的選項。

CSS內容可大致分為元素樣式和自定義樣式，元素樣式的作用基本都是全局性的，如td將應用于頁面中全部的單元格。而自定義樣式(即類樣式)可選擇性地應用于頁面的某個部分。在編輯窗口左方是樣式列表，其中包含著元素樣式和類樣式，點擊橙色箭頭處可新建元素，點擊紫色箭頭處可新建類。

點擊藍色箭頭處的兩個按鈕可將編輯窗口拆分為源代碼或文本預覽。此外在編輯的同時檢查器調板〖CTRL_1〗也會出現文本預覽。

在左方選擇一個樣式后，則可進入編輯狀態，如下左圖，共有7大項目：字體屬性、文本屬性、塊屬性、邊距和填充、邊框和外框、列表項目及其它、背景屬性。默認為字體屬性。相應屬性如果被設定，將會在信息欄(紅色箭頭處)出現圖標。

點擊綠色箭頭處將出現顏色調板，從中可以選取色彩。GoLive提供了很多專業的色板。

此外，GoLive可以從對象調板〖CTRL_2〗中使用CSS布局，如下圖紅色箭頭處。從而實現CSS+DIV的網頁結構。

建立了CSS布局后將產生相應的樣式，可在頁面的樣式編輯器中進行設定。如下左圖。可同時配合如下右圖的表和框調板進行選擇。

本文來源于成都網站建設公司與成都網站設計制作公司-創新互聯成都公司！

標題名稱：用GoLive實現CSS+DIV之一
新聞來源：http://m.newbst.com/news26/316626.html

成都網站建設公司_創新互聯，為您提供自適應網站、網站營銷、網站設計公司、手機網站建設、、標簽優化

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯