首頁 開發工具 dreamweaver dw怎麼在html連結css文件

dw怎麼在html連結css文件

Jan 06, 2021 am 09:32 AM
css dw

dw在html連結css檔案的方法:首先在dw軟體中建立一個網站並在網站中新建一個CSS資料夾和一個html檔;然後在右上角點選【CSS設計器】,並選擇好css資料夾;最後把加為設定成【連結】,把點擊【確定】按鈕即可。

dw怎麼在html連結css文件

本教學操作環境:Windows7系統、dreamweaverCC 2020&&html5&&css3版本、Dell G3電腦。

推薦:《dreamweaver教學》、《css影片教學

#dw怎麼在html連結css檔案?

1、在軟體中先建立一個網站並在網站中新建一個CSS資料夾和一個html檔。 (可以點選下方引用經驗查看如何建立一個網站)

dw怎麼在html連結css文件

2、在右上角點選【CSS設計器】,並在下方點選【 號】,然後選擇【建立新的CSS檔案】。

dw怎麼在html連結css文件

3、在建立視窗中,點選【瀏覽】按鈕。

dw怎麼在html連結css文件

4、然後選擇網站中已經建立好的名字是CSS的資料夾,然後輸入想建立的CSS的名字(要用英文哦),點選【儲存】。

dw怎麼在html連結css文件

5、然後把加為設定成【連結】,點選【確定】按鈕。

dw怎麼在html連結css文件

6、新增完成後就可以在右側的網站中的CSS資料夾下看到剛剛建立好的CSS樣式表檔案了。

dw怎麼在html連結css文件

7、在左​​側的【head】標籤中,就多了一行連結到CSS檔案的程式碼。在頂部tab標籤中也可以看到連結的樣式表。

dw怎麼在html連結css文件

8、接下來寫一個簡單的網頁來看下CSS樣式表是否鏈 接成功。開啟html網頁編輯頁面,在【body】標籤中輸入一個div。如下圖:

dw怎麼在html連結css文件

9、然後在頂部tab標籤中選擇剛才建立的CSS樣式表,並在樣式表中寫一個樣式,命名為【aaa】,並儲存樣式表【快速鍵Ctrl S】。

dw怎麼在html連結css文件

10、然後回到html編輯頁面,在div標籤中引入class,輸入剛才寫的樣式的名稱【aaa】並儲存網頁【快捷鍵Ctrl S】 。

dw怎麼在html連結css文件

11、點選頂部的設計按鈕,就可以看到即時效果。

dw怎麼在html連結css文件

12、也可以按快捷鍵F12,直接用瀏覽器打開,可以看到真實的效果。證明我們的CSS連結到html中是沒有問題。

dw怎麼在html連結css文件

更多程式相關知識,請造訪:程式設計入門! !

以上是dw怎麼在html連結css文件的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
2 週前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
2 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

如何在網頁上正確顯示本地安裝的'荊南麥圓體”? 如何在網頁上正確顯示本地安裝的'荊南麥圓體”? Apr 05, 2025 pm 10:33 PM

在網頁中使用本地安裝的字體文件最近,我從網上下載了一種免費字體,並成功將其安裝到了我的系統中。現在...

如何通過CSS選擇第一個類名為item的子元素? 如何通過CSS選擇第一個類名為item的子元素? Apr 05, 2025 pm 11:24 PM

在元素個數不固定的情況下如何通過CSS選擇第一個指定類名的子元素在處理HTML結構時,常常會遇到元素個數不�...

如何通過CSS讓多行文本兩端對齊並添加下劃線? 如何通過CSS讓多行文本兩端對齊並添加下劃線? Apr 05, 2025 pm 08:00 PM

如何通過CSS讓多行文本兩端對齊並添加下劃線?在日常的網頁設計中,我們常常需要對多行文本進行特殊的樣式...

如何在Element UI的el-table中調整合併行的懸停樣式和邏輯? 如何在Element UI的el-table中調整合併行的懸停樣式和邏輯? Apr 05, 2025 pm 07:45 PM

如何調整el-table中合併行的懸停樣式和邏輯?在使用Element...

負邊距在某些情況下為何未生效?如何解決這個問題? 負邊距在某些情況下為何未生效?如何解決這個問題? Apr 05, 2025 pm 10:18 PM

負邊距為何在某些情況下未生效?在編程過程中,CSS中的負邊距(negative...

在移動端如何兼容多行溢出省略? 在移動端如何兼容多行溢出省略? Apr 05, 2025 pm 10:36 PM

移動端多行溢出省略在不同設備上的兼容問題在使用Vue2.0開發移動端應用時,常常會遇到需要對文本進行多行溢...

H5頁面製作是否需要持續維護 H5頁面製作是否需要持續維護 Apr 05, 2025 pm 11:27 PM

H5頁面需要持續維護,這是因為代碼漏洞、瀏覽器兼容性、性能優化、安全更新和用戶體驗提升等因素。有效維護的方法包括建立完善的測試體系、使用版本控制工具、定期監控頁面性能、收集用戶反饋和製定維護計劃。

如何使用react-transition-group實現React組件從右向左的緊貼滑動切換效果? 如何使用react-transition-group實現React組件從右向左的緊貼滑動切換效果? Apr 05, 2025 pm 08:03 PM

關於React中使用react-transition-group實現組件切換轉場效果的問題在使用React開發項目時,我們常常需要實現一些流�...

See all articles