bootstrap與dreamweaver有什麼差別

區別：1、bootstrap是基於HTML、CSS、JavaScript的前端框架，而dreamweaver是一個網頁程式碼編輯器；2、bootstrap可以用來快速建立一個響應式網站，而dreamweaver可以用來提高網站開發速度。

本教學操作環境：Windows7系統、bootsrap3.3.7&&Adobe Dreamweaver CS6版、DELL G3電腦

#bootstrap簡介

Bootstrap是Twitter開源的基於HTML、CSS、JavaScript的前端框架。它是為實現快速開發網頁應用程式而設計的一套前端工具包。它支援響應式佈局，並在V3版本之後堅持行動裝置優先。

Bootstrap提供了優雅的HTML和CSS規範，它即是由動態CSS語言Less寫成。 Bootstrap一推出後頗受歡迎，一直是GitHub上的熱門開源項目，包括NASA的MSNBC（微軟全國廣播公司）的Breaking News都使用了該項目。國內一些行動開發者較為熟悉的框架，如WeX5前端開源框架等，也是基於Bootstrap原始碼進行效能優化而來。

包含內容

• 基本架構：Bootstrap 提供了一個有網格系統、連結樣式、背景的基本架構。這將在Bootstrap 基本結構部分詳細講解。

• CSS：Bootstrap 自帶以下功能：全域的 CSS設定、定義基本的 HTML 元素樣式、可擴充的 class，以及先進的網格系統。

• 元件：Bootstrap包含了豐富的網路元件，根據這些元件，可以快速的建構一個漂亮、功能完備的網站。

  其中包含以下元件：　下拉選單、按鈕群組、按鈕下拉式選單、導覽、導覽列、路徑導覽、分頁、排版、縮圖、警告對話方塊、進度列、媒體物件等

• JavaScript 外掛程式：Bootstrap自備了13個jQuery插件，這些插件為Bootstrap中的元件賦予了「生命」。其中包括：模式對話框、標籤頁、捲軸、彈出框等。

作用：

用它提供的樣式和元件快速寫網站

你只需要引用一些定義好的類，也就是class名字，就可以創建出已經有非常漂亮的樣式的網頁，而且支援自適應，是一個很不錯的框架。

簡單點說：是一個快速建立網站前台頁面的開源專案（基於Jquery）。你只需要了解相關的class、標籤名稱等所代表的意思，然後在建構頁面的時候，導入bootstrap的JS、css等，它就會去表現對應的效果出來。

dreamweaver簡介

dreamweaver全名為Adobe Dreamweaver，簡稱“DW”，中文名稱"夢想編織者"，最初為美國MACROMEDIA公司開發，2005年被Adobe公司收購。

DW是集網頁製作和管理網站於一身的所見即所得網頁程式碼編輯器。利用對 HTML、CSS、JavaScript等內容的支持，設計師和程式設計師可以在幾乎任何地方快速製作和進行網站建立。

Adobe Dreamweaver使用所見即所得的接口，亦有HTML（標準通用標記語言下的一個應用）編輯的功能，借助經過簡化的智能編碼引擎，輕鬆地創建、編碼和管理動態網站。存取程式碼提示，即可快速了解 HTML、CSS 和其他Web標準。使用視覺輔助功能減少錯誤並提高網站開發速度。

軟體優點

• 製作效率

  Dreamweaver可以用最快速的方式將Fireworks，FreeHand，或Photoshop等檔案移至網頁上。使用檢色吸管工具選擇螢幕上的顏色可設定最接近的網頁安全色。對於選單，快速鍵與格式控制，只要一個簡單步驟即可完成。 Dreamweaver能與您喜愛的設計工具，如PlaybackFlash，Shockwave和外掛模組等搭配，不需離開Dreamweaver便可完成，整體運用流程自然順暢。除此之外，只要點選便可使Dreamweaver自動開啟Firework或Photoshop來進行編輯與設定圖檔的優化。

• 網站管理

  使用網站地圖可以快速製作網站雛形、設計、更新和重組網頁。改變網頁位置或檔案名稱，Dreamweaver會自動更新所有連結。使用支援文字、HTML碼、HTML屬性標籤和一般語法的搜尋及置換功能使得複雜的網站更新變得迅速又簡單。

• 控制能力

  Dreamweaver是提供RoundtripHTML、視覺化編輯與原始碼編輯同步的設計工具。它包含HomeSite和BBEdit等主流文字編輯器。幀(frames)和表格的製作速度快的令您無法想像。進階表格編輯功能使您簡單的選取單一格、行、欄或未連續之選取。

  甚至可以排序或格式化表格群組，Dreamweaver支援精準定位，利用可輕易轉換成表格的圖層以拖曳置放的方式進行版面配置。所見即所得Dreamweaver成功整合動態出版視覺編輯及電子商務功能，提供超強的支援能力給Third-party廠商，包含ASP，Apache，BroadVision，ColdFusion，iCAT，Tango與自行發展的應用軟體。

  當您正使用Dreamweaver在設計動態網頁時，所見即所得的功能，讓您不需要透過瀏覽器來預覽網頁。夢幻樣版與XMLDreamweaver將內容與設計分開，應用於快速網頁更新與團隊合作網頁編輯。

  建立網頁外觀的樣版，指定可編輯或不可編輯的部份，內容提供者可直接編輯以樣式為主的內容卻不會不小心改變既定之樣式。您也可以使用樣版正確輸入或輸出XML內容。

  全方位的呈現利用Dreamweaver設計的網頁，可以全方位的呈現在任何平台的熱門瀏覽器上。對於cascadingstylesheets的動態HTML支援和滑鼠換圖效果，聲音和動畫的DHTML效果資料庫可在Netscape和Microsoft Internet Explorer上執行。

  使用不同瀏覽器檢示功能，Dreamweaver可以告知您在不同瀏覽器上執行的成效如何。當有新的瀏覽器上市時，只要從Dreamweaver的網站在下載它的描述檔，便可得知詳盡的成效報告。

  無需編寫程式碼即可實作CSS最佳做法。在「屬性」面板中新建CSS規則,並在樣式級聯中清晰、簡單地說明每個屬性的相應位置。

• 全面的CSS支援增強功能

  使用Dreamweaver CS4中增強的CSS實作工具令您的網站脫穎而出。使用「設計」和「即時視圖」中的即時視覺回饋,在「屬性」面板中快速定義和修改CSS規則。使用新增的「相關檔案」和「程式碼導航器」功能找到定義特定CSS規則的位置。

相關推薦：《dreamweaver教程》、《bootstrap使用教程》

以上是bootstrap與dreamweaver有什麼差別的詳細內容。更多資訊請關注PHP中文網其他相關文章！