Dreamweaver CC 2014新功能介紹

網(wǎng)頁設(shè)計軟件Dreamweaver CC 2014 版包含“實時檢查”和“CSS 設(shè)計工具”等多項增強功能，可以幫助用戶更加輕松地創(chuàng)建和更新桌面平臺和移動設(shè)備的網(wǎng)頁內(nèi)容，另外，新的“元素快速檢查”功能可以幫助網(wǎng)頁設(shè)計師速檢查、預覽及編輯眾多的HTML標記等。

　　下面我們詳細介紹Dreamweaver CC 2014 帶來的新功能和其他增強功能：包括網(wǎng)頁元素快速檢查、實時檢查中的新編輯功能、CSS 設(shè)計工具增強功能、實時插入、使用身份文件支持 SFTP 連線、還原/重做增強功能、Business Catalyst 和 PhoneGap Build 工作流程的變化、存取 Dreamweaver 擴展功能的變化、同步設(shè)置、直接從 Dreamweaver 發(fā)送錯誤/功能要求、幫助中心(Help Center)、幫助菜單變化等等。

　　網(wǎng)頁元素快速檢查

　　Dreamweaver CC 2014 使用新增的“元素快速檢查”來檢查文件中的標記，可為靜態(tài)和動態(tài)內(nèi)容產(chǎn)生互動式 HTML 樹狀結(jié)構(gòu)。直接在 HTML 樹狀結(jié)構(gòu)中修改您的靜態(tài)內(nèi)容結(jié)構(gòu)。

圖示：元素快速檢查

　　Dreamweaver CC 2014 推出“元素快速檢查”(菜單位置“檢查 > 元素快速檢查”) 是為了幫助網(wǎng)頁設(shè)計者簡化設(shè)計過程、加快開發(fā)速度。在之前版本的 Dreamweaver 中，用戶必須在“實時檢查”中標示 HTML 元素，切換至代碼檢查，再編輯該元素。編輯之后必須再切換回到“實時檢查”才能預覽變化?，F(xiàn)在有了“元素快速檢查”，設(shè)計師就可以在清晰簡的單一檢查界面中檢查所有元素，并編輯靜態(tài)內(nèi)容。

實時檢查中的新編輯功能

　　Dreamweaver CC 2014 可以直接在“實時檢查”中檢查及變化任何 HTML 元素的屬性，不需要重新整理任何項目即可查看其外觀。

　　A、快速屬性檢查器

　　“實時檢查”現(xiàn)在會針對您的頁面中的 HTML 元素顯示“快速屬性檢查器”。根據(jù)您選取的 HTML 元素，“快速屬性檢查器”可讓您直接在“實時檢查”中編輯屬性或文字。

圖示：用于編輯圖像屬性的快速屬性檢查

圖示：用于設(shè)置文字格式的快速屬性檢查

　　B、元素顯示

　　有了新的“元素顯示”，您現(xiàn)在可以直接在“實時檢查”中建立 HTML 元素與類別和 ID 的關(guān)聯(lián)。“元素顯示”會提供您可用類別和 ID 的提示，幫助您快速檢查及選擇所需的選項。

　　用于編輯類別和 ID 的元素顯示

　　C、實時編輯文字

　　Dreamweaver CC 2014 可以直接在“實時”檢查中編輯文字并且預覽變化，而不需要在不同的檢查之間來回切換。

　　在“實時”檢查中的文字元素上按兩下，就會進入編輯模式。

直接在實時檢查中編輯文字

　　D、實時檢查屬性檢查器

　　Dreamweaver CC 2014 現(xiàn)在可在“實時檢查”中使用“屬性檢查器”快速進行頁面的編輯，而不必切換到“設(shè)計”或“代碼”檢查。

實時檢查屬性檢查器

CSS設(shè)計工具增強功能

　　A、邊框控制項界面增強

　　標簽控制項可幫助您以簡單而直覺的方式，設(shè)置四面邊框?qū)傩浴?/p>

　　標簽控制可避免同時看到所有值，以減少混淆的情形。

　　直覺式方便的圖示，任何新手都能遵照執(zhí)行。

　　有兩組圖示，可顯示未設(shè)置/已刪除與已停用狀態(tài)。

　　單一步驟“每一側(cè)”索引標簽，可一次設(shè)置所有邊框?qū)傩浴?/p>

　　已計算的列可在檢查時引導您到最適當?shù)乃饕龢撕灐?/p>

圖示：之前版本的Dreamweaver邊框控制項內(nèi)容

圖示：Dreamweaver CC 2014 的邊框控制項內(nèi)容

　　B、復制粘貼樣式

　　新的 Dreamweaver CC 2014 版本支持從一個選擇器復制樣式并貼入另一個選擇器中。用戶可以復制所有樣式，也可以僅復制特定樣式類別，如“版面”、“文字”和“邊框”。

　　以鼠標右鍵按一下選擇器，然后選擇可用選項：

圖示：使用 CSS 設(shè)計工具復制樣式

　　如果選擇器沒有樣式，會停用“復制”和“復制全部樣式”。

　　無法進行編輯的遠端網(wǎng)站會停用“貼上樣式”，但可以使用“復制”和“復制全部樣式”。

　　選擇器上已有的部分“貼上樣式”(重疊) 則可正常運作。此時會貼上所有選擇器的聯(lián)集。

　　復制并貼上樣式也可以在各種不同的 CSS 文件連結(jié)中運作：包括導入、連結(jié)、內(nèi)嵌樣式。

　　C、快速編輯文字塊

　　Dreamweaver CC 2014版本支持快速編輯文字塊，您可以在其中指定屬性的速記代碼，如邊界、間距、邊框和邊框半徑。這項變化是特別為偏好指定代碼的使用者設(shè)計，以便使用鼠標/鍵盤來指定屬性。

　　D、自定義屬性工作流程增強功能

　　之前，您必須在 CSS 設(shè)計工具的“屬性”面板中按一下 +，以新增“Other”(或自定義) 屬性?，F(xiàn)在有一組文字方塊 - 屬性名稱和值 - 在“屬性”清單尾端隨時供您使用。這些文字方塊可讓您直接輸入屬性名稱及其值，而不必先按一下 +。

　　如果要新增自定義屬性的其他列，請按“索引標簽”。

　　“other”屬性群組的名稱已變化為“Custom”。

　　E、鍵盤快捷鍵

　　Dreamweaver CC 2014新版支持使用鍵盤快捷鍵新增或刪除 CSS 選擇器和屬性，也可以在“屬性”面板中的屬性群組之間瀏覽。

　　CTRL+Alt+[Shift =] ：新增選擇器 (如果控制項位于選擇器區(qū)段之中)

　　Ctrl+Alt+S ：新增選擇器 (如果控制項位于應用程序中任何位置)

　　CTRL+Alt+[Shift =] ：新增屬性 (如果控制項位于屬性區(qū)段之中)

　　CTRL+Alt+P ：新增屬性 (如果控制項位于應用程序中任何位置)

　　選取 + 刪除 ：刪除選擇器 (如果已選取了選擇器)

　　CTRL+Alt+(PgUp/PgDn) ：位于屬性子面板時，在區(qū)段之間跳動

　　F、較為特定/較不特定選擇器

　　Dreamweaver CC 2014新版會在加入選擇器時提供最多三條規(guī)則提示，用戶可以使用上/下鍵，在“較為特定/較不特定”之間切換。

圖示：較為特定/較不特定選擇器

　　G、滾動至類別

　　在之前版本中，當您在 CSS 設(shè)計工具的“屬性”面板頂端按一下“背景”或“其他”類別時，這些類別會在面板中變得“可見”，但其實類別并非確實顯示在面板頂端。

　　現(xiàn)在，Dreamweaver CC 2014新版的“背景”和“其他”類別 (重新命名為“自定義”) 會在用戶按一下時顯示在面板的頂端。