在屬性檢視窗中設定文字屬性 - Adobe Support

了解如何在Dreamweaver 中使用文字「屬性」檢視窗，套用HTML 格式或CSS 格式。

... 將目標規則靠左對齊、置中對齊或靠右對齊。

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

您可以使用文字「屬性」檢視窗，套用HTML格式或串接樣式表(CSS)格式。

當您套用HTML格式時，Dreamweaver會將屬性加入至網頁內文的HTML程式碼中。

當您套用CSS格式時，Dreamweaver會將屬性寫入文件的標題或不同的樣式表中。

註解： 當您建立CSS行內樣式時，Dreamweaver會將樣式屬性程式碼直接新增到頁面內文。

關於格式化文字(CSS與HTML) 在Dreamweaver中格式化文字，就像是使用標準的文書處理器。

您可以設定文字區塊的預設格式化樣式(段落、標題1、標題2等)、變更所選文字的字體、大小、顏色和對齊方式，或是套用文字樣式，如粗體、斜體、程式碼(固定寬度)和底線。

Dreamweaver已將「CSS屬性」和「HTML屬性」兩個檢視窗合而為一。

當您使用「CSS屬性」檢視窗時，Dreamweaver會使用「串接樣式表」(CSS)設定文字的格式。

對於網站設計者及開發人員來說，CSS對網頁設計提供更多的控制，同時又能提供增強的輔助功能及降低檔案大小。

「CSS屬性」檢視窗可讓您存取現有的樣式，並建立新的樣式。

使用CSS是控制網頁樣式的方法，而不需與其架構妥協。

藉由將視覺設計元素(字體、顏色、邊界等)從網頁的結構邏輯中分離出來，CSS便能同時將視覺和排版控制提供給網頁設計者，不需犧牲內容的完整性。

此外，從單一明確的程式碼區塊中定義排版設計和頁面版面，不需依靠影像地圖、font標籤、表格及間隔影像GIF，便能達到更快速的下載、有效率的網站維護，並提供可控制多個網頁之設計屬性的單一位置。

您可以直接在文件中儲存以CSS建立的樣式，若有更強大的功能與彈性需求，您可以將樣式儲存在外部樣式表中。

如果您將外部樣式表附加到好幾個網頁，您在這個樣式表上所做的變更都會自動套用在這些網頁。

若要存取頁面的所有CSS規則，請使用「CSS樣式」面板(「視窗>CSS樣式」)。

若要存取套用到目前選取範圍的規則，請使用「CSS樣式」面板(目前模式)或「CSS屬性」檢視窗中的「目標規則」彈出式選單。

如果喜歡的話，您可以選擇使用HTML標記標籤來格式化網頁中的文字。

若要使用HTML標籤(而非CSS)，請使用「HTML屬性」檢視窗設定文字的格式。

註解： 您可以將CSS和HTML3.2格式化合併於同一個頁面內使用。

格式化會以階層方式進行套用：HTML3.2格式化會覆寫由外部CSS樣式表所套用的格式化，而文件內嵌的CSS會覆寫外部CSS。

編輯屬性檢視窗中的CSS規則 如果「屬性」檢視窗尚未開啟，請選取「視窗 >屬性」將其開啟，然後選取面板左上角的CSS選項。

請執行下列其中一項作業： 將插入點置於您要編輯之規則所套用的文字區塊中。

該項規則便會出現在「目標規則」彈出式選單中。

從「目標規則」彈出式選單中，選取要編輯的規則。

按一下「編輯規則」。

從「目標規則」彈出式選單中，選取要編輯的規則。

使用「CSS屬性」檢視窗中的各個選項變更規則內容。

目標規則 您要編輯的規則是否在「CSS屬性」檢視窗中？當文字已套用現有樣式時，如果您按一下網頁上的文字，影響文字格式的規則便會出現。

您也可以使用「目標規則」彈出式選單建立新的CSS規則、新的行內樣式，或對選取的文字套用現有類別。

如果要建立新規則，您必須完成「新增CSS規則」對話方塊的各項設定。

如需詳細資訊，請參閱本主題於結尾處提供的連結。

編輯規則 針對目標規則開啟「CSS規則定義」對話方塊。

如果在「目標規則」彈出式選單中選取「新增CSS規則」，然後按一下「編輯規則」按鈕，Dreamweaver會改為開啟「新增CSS規則定義」對話方塊。

CSS設計工具 開啟「CSS設計工具」面板，並且在「目前」檢視中顯示目標規則的屬性。

字體 變更目標規則的字體。

大小 設定目標規則的字體大小。

文字顏色 將選定的顏色設定為目標規則中的字體顏色。

請按一下顏色方塊，或在相鄰的文字欄位中輸入十六進位值(例如#BB5153)，選取網頁安全色。

使用「編輯規則」選項編輯CSS規則。

粗體 將粗體屬性加入至目標規則。

斜體 將斜體屬性加入至目標規則。

靠左對齊、置中對齊和靠右對齊 將目標規則靠左對齊、置中對齊或靠右對齊。

註解： 「字體」、「大小」、「文字顏色」、「粗體」、「斜體」和「對齊」屬性總是會顯示套用至「文件」視窗中目前選取範圍之規則的屬性。

只要變更這些屬性的任一項，都會影響目標規則。

使用「屬性」檢視窗編輯文字顏色 如果您尚未對文字套用任何特定規則，您可以直接從「屬性」檢視窗編輯文字的顏色。

在以下範例中，請注意文字在編輯之前的顏色。

檢色器旁邊的欄位會顯示白色，指出游標所在位置文字的顏色。

在Dreamweaver中編輯文字顏色 若要編輯文字的顏色，請選取您想要編輯的文字。

按一下檢色器，然後選取任何您要的顏色。

「屬性」檢視窗將顯示新的顏色，如下圖所示。

使用檢色器修改文字的顏色 在屬性檢視窗中設定HTML格式 如果「屬性」檢視窗尚未開啟，請按一下「視窗>屬性」將它開啟，然後按一下HTML按鈕。

選取您想要設定格式的文字。

設定您要套用到選取文字的選項： 設定HTML格式的文字屬性 格式 會設定選取文字的段落樣式。

「段落」會套用

標籤的預設格式，「標題1」會新增H1標籤，依此類推。

ID 為您的選取範圍指派ID。

「ID」彈出式選單(如果適用)會列出文件所有未使用的已宣告ID。

類別 會顯示目前套用到選取之文字的類別樣式。

如果選取範圍還沒有套用任何樣式，彈出式選單就會顯示「沒有CSS樣式」。

如果選取範圍套用了多種樣式，選單便會顯示空白。

請使用「樣式」彈出式選單執行下列任何作業：選取您要套用到選取範圍的類別樣式。

選取「無」以移除目前選取的樣式。

選取「重新命名」以重新命名樣式。

選取「附加樣式表」以開啟對話方塊，讓您可以將外部樣式表附加至網頁。

粗體 會根據「偏好設定」對話方塊中「一般」類別中設定的樣式偏好設定，在選取的文字上套用或。

斜體 會根據「偏好設定」對話方塊中「一般」類別中設定的樣式偏好設定，在選取的文字上套用或。

項目清單 會建立選取文字的項目清單。

如果沒有選取文字，就會啟動新的項目清單。

編號清單 會建立選取文字的編號清單。

如果沒有選取文字，就會啟動新的編號清單。

區塊引言與移除區塊引言 會將選取的文字縮排或移除縮排，方法是套用或移除blockquote標籤。

在清單中，縮排會建立巢狀結構的清單，而移除縮排則會取消清單的巢狀結構。

連結 會建立選取文字的超連結。

請按一下資料夾圖示，以瀏覽網站中的檔案；輸入URL；拖曳「指向檔案」圖示到「檔案」面板中的檔案，或從「檔案」面板將檔案拖曳到方塊中。

標題 指定超文字連結的文字工具提示。

目標 指定要載入連結文件的頁框或視窗：_blank會在新的、未命名的瀏覽器視窗中載入連結的檔案。

_parent會在上一層頁框組或包含連結的頁框之視窗中載入連結的檔案。

如果包含連結的頁框不是巢狀的，則會在完整的瀏覽器視窗中載入連結的檔案。

_self會在與連結所在的同一個頁框或視窗載入連結的檔案。

這是隱含的目標，所以您通常不需要指定它。

_top會在完整的瀏覽器視窗中載入連結的檔案，同時移除所有頁框。

從HTML屬性檢視窗重新命名類別 Dreamweaver會在「HTML屬性」檢視窗的「類別」選單中，顯示網頁可以使用的所有類別。

您可以選取位於類別樣式清單結尾的「重新命名」選項，重新命名這份清單中的樣式。

從「屬性」檢視窗面板中，選取「類別」下拉式清單。

從彈出的清單中，選取位於清單末尾的「重新命名」。

從「重新命名樣式」彈出式選單中，選取您要重新命名的樣式。

重新命名HTML類別 在「新增名稱」文字欄位中輸入新的名稱，然後按一下「確定」。

更多類似項目開啟CSS樣式面板了解串接樣式表 登入您的帳戶 登入 管理帳戶 快速連結 檢視您的所有計劃 管理您的計劃 法律說明   |   線上隱私權政策 [FeedbackV2Badge] LanguageNavigation LanguageNavigation 選擇您的地區 選取地區會變更Adobe.com上的語言及/或內容。

Americas Brasil Canada-English Canada-Français Latinoamérica México Chile UnitedStates AsiaPacific Australia HongKongS.A.R.ofChina India-English NewZealand SoutheastAsia(IncludesIndonesia,Malaysia,Philippines,Singapore,Thailand,andVietnam)-English 中国 中國香港特別行政區 台灣地區 日本 한국 Singapore Thailand-English ประเทศไทย Europe,MiddleEastandAfrica Africa-English België-Nederlands Belgique-Français Belgium-English Českárepublika Cyprus-English Danmark Deutschland Eesti España France Greece-English Ireland Israel-English Italia Latvija Lietuva Luxembourg-Deutsch Luxembourg-English Luxembourg-Français Magyarország Malta-English MiddleEastandNorthAfrica-English Nederland Norge Österreich Polska Portugal România Schweiz Slovenija Slovensko Suisse Suomi Svizzera Türkiye UnitedKingdom България Россия Україна الشرقالأوسطوشمالأفريقيا-اللغةالعربية ישראל-עברית Sverige SaudiArabia-English UnitedArabEmirates-English الإماراتالعربيةالمتحدة المملكةالعربيةالسعودية