使用手冊 取消

新增媒體物件

  1. Dreamweaver 使用手冊
  2. 簡介
    1. 多方互動網頁設計基本概念
    2. Dreamweaver 的新增功能
    3. 使用 Dreamweaver 開發網頁 - 總覽
    4. Dreamweaver / 常見問題
    5. 鍵盤快速鍵
    6. Dreamweaver 系統需求
    7. 功能摘要
  3. Dreamweaver 和 Creative Cloud
    1. 將 Dreamweaver 設定與 Creative Cloud 同步
    2. Dreamweaver 中的 Creative Cloud Libraries
    3. 在 Dreamweaver 中使用 Photoshop 檔案
    4. 使用 Adobe Animate 和 Dreamweaver
    5. 從資料庫擷取網頁最佳化的 SVG 檔案
  4. Dreamweaver 工作區和檢視
    1. Dreamweaver 工作區
    2. 最佳化視覺開發的 Dreamweaver 工作區
    3. 根據檔案名稱或內容搜尋檔案 | Mac OS
  5. 設定網站
    1. 關於 Dreamweaver 網站
    2. 設定網站的本機版本
    3. 連線到發佈伺服器
    4. 設定測試伺服器
    5. 匯入和匯出 Dreamweaver 網站設定
    6. 將現有網站從遠端伺服器帶入本機網站根目錄
    7. Dreamweaver 中的輔助功能
    8. 進階設定
    9. 設定網站偏好設定以傳送檔案
    10. 在 Dreamweaver 中指定 Proxy 伺服器設定
    11. 將 Dreamweaver 設定與 Creative Cloud 同步
    12. 在 Dreamweaver 中使用 Git
  6. 管理檔案
    1. 建立和開啟檔案
    2. 管理檔案和資料夾
    3. 下載和上傳伺服器檔案
    4. 存回和取出檔案
    5. 同步化檔案
    6. 比較檔案差異
    7. 遮罩 Dreamweaver 網站中的檔案和資料夾
    8. 啟用 Dreamweaver 網站的設計備註
    9. 防止 Gatekeeper 遭到潛在惡意利用
  7. 版面和設計
    1. 使用視覺輔助以配置版面
    2. 關於使用 CSS 配置頁面
    3. 使用 Bootstrap 設計回應式網站
    4. 在 Dreamweaver 中建立及使用媒體查詢
    5. 以表格呈現內容
    6. 顏色
    7. 使用流變格線版面的互動設計
    8. Dreamweaver 中的 Extract
  8. CSS
    1. 了解串接樣式表
    2. 使用 CSS 設計工具配置頁面
    3. 在 Dreamweaver 中使用 CSS 預處理器
    4. 如何在 Dreamweaver 中設定 CSS 樣式偏好設定
    5. 在 Dreamweaver 中移動 CSS 規則
    6. 在 Dreamweaver 中將行內 CSS 轉換為 CSS 規則
    7. 使用 div 標籤
    8. 套用漸層至背景
    9. 在 Dreamweaver 中建立與編輯 CSS3 轉變效果
    10. 格式化程式碼
  9. 頁面內容和資產
    1. 設定頁面屬性
    2. 設定 CSS 標題屬性和 CSS 連結屬性
    3. 處理文字
    4. 尋找和取代文字、標籤和屬性
    5. DOM 面板
    6. 在即時檢視中編輯
    7. 在 Dreamweaver 中進行文件編碼
    8. 在文件視窗中選取並檢視元素
    9. 在屬性檢視窗中設定文字屬性
    10. 檢查網頁拼字
    11. 在 Dreamweaver 中使用水平線
    12. 在 Dreamweaver 中新增和修改字體組合
    13. 使用資源
    14. 在 Dreamweaver 中插入和更新日期
    15. 在 Dreamweaver 中建立和管理最愛資源
    16. 在 Dreamweaver 中插入及編輯影像
    17. 新增媒體物件
    18. 在 Dreamweaver 中加入視訊
    19. 插入 HTML5 視訊
    20. 插入 SWF 檔
    21. 新增音效效果
    22. 在 Dreamweaver 中插入 HTML5 音效
    23. 使用圖庫項目
    24. 在 Dreamweaver 中使用阿拉伯文和希伯來文文字
  10. 連結和導覽
    1. 關於連結和導覽
    2. 連結
    3. 影像地圖
    4. 連結疑難排解
  11. jQuery Widget 和效果
    1. 在 Dreamweaver 中使用 jQuery UI 和 Mobile Widget
    2. 在 Dreamweaver 中使用 jQuery 效果
  12. 撰寫網站程式碼
    1. 關於在 Dreamweaver 中撰寫程式碼
    2. Dreamweaver 的程式碼撰寫環境
    3. 設定程式碼撰寫偏好設定
    4. 自訂程式碼色彩標示
    5. 撰寫和編輯程式碼
    6. 程式碼提示和程式碼完成
    7. 收合和展開程式碼
    8. 利用片段重複使用程式碼
    9. Lint 程式碼
    10. 最佳化程式碼
    11. 在設計檢視中編輯程式碼
    12. 使用頁面的檔頭內容
    13. 在 Dreamweaver 中插入伺服器端包含
    14. 在 Dreamweaver 中使用標籤資料庫
    15. 匯入自訂標籤到 Dreamweaver
    16. 使用 JavaScript 行為 (一般說明)
    17. 套用內建的 JavaScript 行為
    18. 關於 XML 與 XSLT
    19. 在 Dreamweaver 中執行伺服器端 XSL 轉換
    20. 在 Dreamweaver 中執行用戶端 XSL 轉換
    21. 在 Dreamweaver 中新增 XSLT 字元實體
    22. 格式化程式碼
  13. 跨產品工作流程
    1. 安裝與使用 Dreamweaver 的擴充功能
    2. Dreamweaver 中的應用程式內更新
    3. 在 Dreamweaver 中插入 Microsoft Office 文件 (僅適用於 Windows)
    4. 使用 Fireworks 和 Dreamweaver
    5. 使用 Contribute 編輯 Dreamweaver 網站的內容
    6. Dreamweaver-Business Catalyst 整合
    7. 建立個人化的電子郵件行銷活動
  14. 範本
    1. 關於 Dreamweaver 範本
    2. 辨識範本和以範本為架構的文件
    3. 建立 Dreamweaver 範本
    4. 建立範本的可編輯區域
    5. 在 Dreamweaver 中建立重複區域和表格
    6. 使用範本中的選擇性區域
    7. 在 Dreamweaver 中定義可編輯的標籤屬性
    8. 如何在 Dreamweaver 中建立巢狀範本
    9. 編輯、更新和刪除範本
    10. 在 Dreamweaver 中匯出及匯入 XML 內容
    11. 對現有的文件套用或移除範本
    12. 編輯 Dreamweaver 範本的內容
    13. Dreamweaver 中範本標籤的語法規則
    14. 設定範本區域的標示偏好設定
    15. 使用 Dreamweaver 範本的好處
  15. 行動裝置和多螢幕
    1. 建立媒體查詢
    2. 為行動裝置變更頁面方向
    3. 使用 Dreamweaver 為行動裝置建立網頁用程式
  16. 動態網站、網頁和網站表單
    1. 了解網頁用程式
    2. 設定您的電腦以進行應用程式開發
    3. 疑難排解資料庫連線
    4. 在 Dreamweaver 中移除連線 Script
    5. 設計動態網頁
    6. 動態內容來源總覽
    7. 定義動態內容的來源
    8. 將動態內容新增至頁面
    9. 在 Dreamweaver 中變更動態內容
    10. 顯示資料庫記錄
    11. 在 Dreamweaver 中提供即時資料及進行疑難排解
    12. 在 Dreamweaver 中新增自訂伺服器行為
    13. 使用 Dreamweaver 建立表單
    14. 使用表單向使用者收集資訊
    15. 在 Dreamweaver 中建立及啟用 ColdFusion 表單
    16. 建立網站表單
    17. 加強對 HTML5 表單元素的支援
    18. 使用 Dreamweaver 開發表單
  17. 以視覺化方式建立應用程式
    1. 在 Dreamweaver 中建立主要和細節頁面
    2. 建立搜尋及結果頁面
    3. 建立記錄插入頁面
    4. 在 Dreamweaver 中建立更新記錄頁面
    5. 在 Dreamweaver 中建立記錄刪除頁面
    6. 在 Dreamweaver 中使用 ASP 命令修改資料庫
    7. 建立註冊頁面
    8. 建立登入頁面
    9. 建立唯有授權用戶才能存取的頁面
    10. 使用 Dreamweaver 保護 ColdFusion 中的資料夾
    11. 在 Dreamweaver 中使用 ColdFusion 組件
  18. 測試、預覽和發佈網站
    1. 預覽頁面
    2. 在多部裝置上預覽 Dreamweaver 網頁
    3. 測試 Dreamweaver 網站

 

了解如何在 Dreamweaver 網頁中插入和編輯媒體物件、使用「設計備註」等等。

除了 SWF 和 FLV 檔之外,您還可以將其他音效/視訊物件插入 Dreamweaver 文件中。如果您已經隨同媒體物件插入輔助功能屬性,則可以設定輔助功能屬性,並在 HTML 程式碼中編輯這些值。

  1. 將插入點放在「文件」視窗中您想要插入物件的位置上。
  2. 請執行下列其中一項作業來插入物件:
    • 在「插入」面板的「HTML」類別中,選取您要插入之物件類型的圖示。

    • 從「插入 > HTML」子選單中選取適當的物件。

    • 接著會出現對話方塊,讓您為媒體物件選取原始檔案和指定某些參數。

    註解:

    如果不想讓這類對話方塊出現,請選取「編輯 > 偏好設定 > 一般設定」(Windows) 或「Dreamweaver > 偏好設定 > 一般設定」(Macintosh),並取消選取「插入物件時顯示對話方塊」選項。若要覆寫任何針對顯示對話方塊所設定的偏好設定,請在插入物件時按住 Control (Windows) 或 Option (Macintosh) 鍵。 

  3. 完成「選取檔案」對話方塊,然後按一下「確定」。
    註解:

    如果您已在「編輯 > 偏好設定」對話方塊中選擇在插入媒體時顯示屬性,便會出現「輔助功能屬性」對話方塊。

  4. 設定輔助功能屬性。
    註解:

    您也可以編輯媒體物件屬性,方法是選取物件,然後在「程式碼」檢視中編輯 HTML 程式碼,或是按一下右鍵 (Windows) 或 Control+按一下 (Macintosh),然後選取「編輯標籤程式碼」。

    標題

    輸入媒體物件的標題。

    存取鍵

    在文字方塊中輸入鍵盤對應值 (單一字母),以便在瀏覽器中選取表單物件。這可讓網站瀏覽者使用 Control 鍵 (Windows) 搭配「存取鍵」來存取物件。例如,如果您輸入 B 做為「存取鍵」,請使用 Control+B 在瀏覽器中選取物件。

    定位停駐點索引

    輸入表單物件定位停駐點順序的編號。如果頁面上有其他連結和表單物件,而且需要使用者依特定順序以 Tab 鍵在其中依序移動,設定 Tab 鍵順序就很有用處。如果您針對物件設定了 Tab 鍵順序,就必須對所有物件都設定 Tab 鍵順序。

  5. 請按一下「確定」以插入媒體物件。
    註解:

    如果您按一下「取消」,媒體物件預留位置會出現在文件中,但是 Dreamweaver 並沒有將輔助功能標籤或屬性與它建立關聯。

    若要指定原始檔案,或設定尺寸及其他參數和屬性,請使用每個物件的「屬性」檢視窗。您可以編輯物件的輔助功能屬性。

啟動媒體檔案的外部編輯器

您可以從 Dreamweaver 啟動外部編輯器,以便編輯大部分的媒體檔案。您也可以指定您希望由 Dreamweaver 啟動用來編輯檔案的編輯器。

  1. 請確定媒體檔案類型已關聯到您系統上的編輯器。

    若要查明與檔案類型相關聯的編輯器,請在 Dreamweaver 中選取「編輯 > 偏好設定」,再從「分類」清單中選取「檔案類型/編輯器」。按一下「副檔名」欄中的檔案副檔名,便可檢視「編輯器」欄中相關的編輯器。您可以變更關聯到某種檔案類型的編輯器。

  2. 按兩下「檔案」面板中的媒體檔案,便可在外部編輯器中開啟此檔案。

    當您在「檔案」面板中按兩下檔案時所啟動的編輯器,就稱為主要編輯器。例如,如果您按兩下影像檔案,Dreamweaver 便會在主要外部影像編輯器中 (如 Adobe Fireworks) 開啟此檔案。

  3. 如果您不希望使用主要外部編輯器來編輯檔案,可以藉由執行下列其中一項作業,使用系統上另一個編輯器來編輯檔案:
    • 在「檔案」面板中,以右鍵按一下 (Windows) 或 Control+按一下 (Macintosh) 檔案名稱,並從快顯選單中選取「開啟使用」。

    • 在「設計」檢視中,在目前頁面的媒體元素上按一下右鍵 (Windows) 或 Control+按一下 (Macintosh),並從快顯選單中選取「編輯程式」。

指定從 Dreamweaver 啟動的編輯器

您可以指定希望 Dreamweaver 用來編輯檔案類型的編輯器,並且新增或刪除 Dreamweaver 可以辨識的檔案類型。

針對指定的檔案類型,明確指定應該啟動哪種外部編輯器

  1. 選取「編輯 > 偏好設定」,再從「分類」清單中選取「檔案類型/編輯器」。

    副檔名 (例如 .gif、.wav 和 .mpg) 會列在左邊「副檔名」的下方。與所選取副檔名關聯的編輯器則會列在右邊「編輯器」的下方。

  2. 在「副檔名」清單中選取該檔案類型的副檔名,然後執行下列其中一項作業:
    • 若要將新的編輯器與檔案類型建立關聯,按一下「編輯器」清單上方的加號 (+) 按鈕,然後完成出現的對話方塊。

      例如,選取 Acrobat 的應用程式圖示,將它關聯到檔案類型。

    • 若要將編輯器設定成某種檔案類型的主要編輯器 (亦即,當您在「檔案」面板中按兩下檔案時所開啟的編輯器),請於「編輯器」清單中選取編輯器,再按一下「設為主要的」。

    • 若要取消檔案類型與編輯器的關聯,請於「編輯器」清單中選取編輯器,再按一下「編輯器」清單上的減號 (-) 按鈕。

新增檔案類型和關聯的編輯器

  1. 按一下「副檔名」清單上的加號 (+) 按鈕,再輸入檔案類型副檔名 (包括副檔名開頭的句點),或是輸入幾個以空格分隔的相關副檔名。

    例如,您可以輸入 .xml .xsl,以便建立它們與您系統上已安裝之 XML 編輯器的關聯。

  2. 請按一下「編輯器」清單上的加號 (+) 按鈕,再完成出現的對話方塊,便能選取檔案類型的編輯器。

移除檔案類型

  1. 在「副檔名」清單中選取該檔案類型,再按一下「副檔名」清單上的減號 (-) 按鈕。
    註解:

    移除檔案類型後將無法還原,所以請確定您的確要將它移除。

對媒體物件使用設計備註

就像對 Dreamweaver 中的其他物件一樣,您可以將「設計備註」新增到媒體物件。「設計備註」是與特殊檔案關聯的備註,並儲存在個別的檔案中。您可以使用「設計備註」來記錄與文件關聯的額外檔案資訊,如影像原始檔案名稱和對檔案狀態的註解。

  1. 在「文件」視窗中用滑鼠右鍵按一下 (Windows) 或按 Control+按一下 (Macintosh) 物件。
    註解:

    新增「設計備註」到任何物件之前,您必須先定義網站。

  2. 從快顯選單中選取「此頁的設計備註」。
  3. 在「設計備註」中輸入您要的資訊。
    註解:

    您也可以從「檔案」面板新增「設計備註」到媒體物件,方法是選取檔案、顯示快顯選單,然後從快顯選單選擇「設計備註」。

加入視訊 (非 FLV)

您可以使用不同方式和不同格式,將視訊新增到網頁。視訊可以下載到使用者端,也可以用資料流方式邊下載邊播放。

  1. 先將影片片段放在網站資料夾中。

    這些片段通常是 AVI 或 MPEG 檔案格式。

  2. 在頁面中連結到此片段或將它嵌入。

    若要連結到片段,請輸入連結的文字,如「下載片段」,然後選取文字,並按一下「屬性」檢視窗中的資料夾圖示。請瀏覽至視訊檔並選取它。

    註解:

    使用者必須下載輔助工具應用程式 (外掛程式),才能檢視一般串流格式,如 Real Media、QuickTime 和 Windows Media。

插入外掛程式內容

您可以對瀏覽器外掛程式建立像是 QuickTime 影片的內容,然後再使用 Dreamweaver 將該內容插入 HTML 文件中。典型的外掛程式包括 RealPlayer 和 QuickTime,而其他內容檔則包括 MP3 和 QuickTime 影片。

您可以直接在「文件」視窗的「設計」檢視中,預覽使用瀏覽器外掛程式的影片和動畫。您可以一次播放所有外掛程式元素,查看使用者在網頁上看到的外觀,或者您也可以分開來個別播放,以確定嵌入了正確的媒體元素。

註解:

您無法在預覽使用 ActiveX 控制項的影片或動畫。

在插入外掛程式的內容之後,請使用「屬性」檢視窗來設定該內容的參數。若要在「屬性」檢視窗中檢視下列屬性,請選取外掛程式物件。

「屬性」檢視窗一開始會顯示最常用的屬性。按一下右下角的展開箭頭即可查看所有屬性。

插入外掛程式內容並設定其屬性

  1. 在「文件」視窗的「設計」檢視中,將插入點置於您要插入內容的位置,然後執行下列其中一項作業:
    • 在「插入」面板的「常用」類別中,按一下「媒體」按鈕,並從選單選取「外掛程式」圖示

    • 選取「插入 > 媒體 > 外掛程式」。

  2. 在出現的對話方塊中,選取外掛程式的內容檔案,然後按一下「確定」。
  3. 在「屬性」檢視窗中設定外掛程式選項。

    名稱

    指定用來識別要以 Script 處理的外掛程式名稱。在「屬性」檢視窗最左邊沒有標籤的文字方塊中輸入名稱。

    W 和 H

    以像素為單位,指定頁面上配置給物件的寬度和高度。

    原始檔

    指定原始資料檔。請按一下資料夾圖示瀏覽檔案,或輸入檔案名稱。

    外掛 URL

    指定 pluginspace 屬性的 URL。請輸入使用者可以下載外掛程式的完整網站 URL。如果檢視這個網頁的使用者沒有外掛程式,瀏覽器會嘗試從這個 URL 下載。

    對齊

    決定物件在頁面上的對齊方式。

    垂直間距和水平間距

    指定外掛程式上、下以及兩邊空白區域的像素單位數量。

    邊框

    指定環繞外掛程式的邊框寬度。

    參數

    會開啟對話方塊,以便輸入要傳遞給外掛程式的其他參數。許多外掛程式會回應特定的參數。

    您也可以按一下「屬性」按鈕,檢視指定給所選取外掛程式的屬性。您可以在這個對話方塊中編輯、新增和刪除如寬度和高度這類屬性。

在文件視窗中播放外掛程式內容

  1. 按照前面小節描述的其中一種方法,插入一或多個媒體元素。
  2. 請執行下列其中一項作業:
    • 選取一個已經插入的媒體元素,然後選取「檢視>外掛程式>播放」,或是在「屬性」檢視窗中按一下「執行」按鈕。

    • 選取「檢視>外掛程式>全部播放」,播放所選取網頁上使用外掛程式的所有媒體元素。

    註解:

    「全部播放」只能套用到目前的文件,不能套用到頁框組中的其他文件。

停止播放外掛程式內容

  1. 選取媒體元素再選取「檢視>外掛程式>停止」,或按一下「屬性」檢視窗中的「停止」按鈕。

    您也可以選取「檢視>外掛程式>停止全部」,停止播放所有的外掛程式內容。

疑難排解外掛程式

如果您按照步驟在「文件」視窗中播放外掛程式內容,但是有些外掛程式內容不會播放,請嘗試下列方法:

  • 確認電腦上已安裝了關聯的外掛程式,而且這個內容與您擁有的外掛程式版本相容。

  • 在文字編輯器中開啟 Configuration/Plugins/UnsupportedPlugins.txt 檔案,查看是否列出了有問題的外掛程式 這個檔案會記錄在 Dreamweaver 中造成問題,因此而不支援的外掛程式 (如果在使用特定外掛程式時遇到問題,可以考慮將它加入這個檔案)。

  • 檢查您是否有足夠的記憶體。有些外掛程式需要額外的 2 到 5 MB 記憶體才能執行。

使用行為控制媒體

您可以將行為新增到頁面,以便啟動或停止各種媒體物件。

控制 Shockwave 或 Flash

可用來播放、停止、倒帶或移至 Shockwave 影片或 SWF 檔的某個影格。

播放聲音

可讓您播放音效;例如,您可以在使用者將滑鼠指標移動到連結上的時候播放音效。

檢查外掛程式

可讓您檢查網站的瀏覽者是否已安裝所需的外掛程式,然後再依據他們是否擁有正確的外掛程式,將他們導引到不同的 URL。這只適用於外掛程式,因為「檢查外掛程式」行為不會檢查 ActiveX 控制項。

使用參數控制媒體物件

定義用於控制 SWF 檔案及外掛程式的特殊參數。這些參數是配合 objectembedapplet 標籤使用。這些參數會設定不同物件類型特有的屬性。例如,SWF 檔可以使用物件標籤的品質參數 <paramname="quality" value="best">。您可以在「屬性」檢視窗中看到「參數」對話方塊。請參閱您所使用之物件的文件,以瞭解所需參數的資訊。

註解:

目前還沒有普遍接受的標準可供識別 ActiveX 控制項的資料檔。請參閱您所使用之 ActiveX 控制項的文件,以瞭解應使用哪些參數。

輸入參數的名稱和值

  1. 在「文件」視窗中選取可以有參數的物件。

  2. 開啟「屬性」檢視窗 (如果還沒有開啟的話),然後按一下位於「屬性」檢視窗下半部的「參數」按鈕 (請確定「屬性」檢視窗已經展開)。

  3. 按一下加號 (+) 按鈕,然後在適當的欄中輸入參數名稱和值。

移除參數

  1. 請先選取參數再按減號 (-) 按鈕。

重新排列參數

  1. 選取參數,然後使用向上鍵和向下鍵按鈕。
Adobe 標誌

登入您的帳戶

[Feedback V2 Badge]