有了好的編輯器，我們就可以很方便的開發(fā)項(xiàng)目，編寫代碼，配置和管理我們的項(xiàng)目。所以在開始編寫 HTML 代碼之前，我們需要先搭建一個(gè)開發(fā)環(huán)境。

網(wǎng)上有很多用于HTML項(xiàng)目開發(fā)和代碼編寫的編輯器，有免費(fèi)的，也有收費(fèi)的。系統(tǒng)環(huán)境中最簡單的用于HTML代碼開發(fā)和編寫的編輯器就是系統(tǒng)自帶的記事本，我們可以使用它來編輯HTML代碼。

使用記事本編寫HTML的步驟是，首先新建一個(gè)文本文檔，按照HTML的語法規(guī)則編寫相關(guān)代碼并保存文件，然后將文件擴(kuò)展名改為.html，用電腦上的瀏覽器打開就可以查看我們代碼的運(yùn)行結(jié)果了。

記事本雖然也可以編寫HTML代碼，但是不夠高效和方便，所以我們還是要使用專業(yè)的編輯器來開發(fā)項(xiàng)目、編寫代碼和管理項(xiàng)目。

常用的編寫HTML代碼的免費(fèi)軟件有vs codesublime text 小程序，Text等。

官網(wǎng)下載地址：

https://www.dcloud.io/hbuilderx.html

VS code官網(wǎng)下載地址：

https://code.visualstudio.com/

文本官網(wǎng)下載地址：

http://www.sublimetext.com/

我們將在以后的所有教程中使用它，因此為了方便學(xué)生的學(xué)習(xí)，我們將提供有關(guān)其下載和安裝的詳細(xì)教程。

1. 下載

首先訪問官方網(wǎng)站：

https://www.dcloud.io/hbuilderx.html

打開上面的下載網(wǎng)址之后，點(diǎn)擊頁面，在彈出的對話框中選擇適合自己電腦的版本進(jìn)行下載。

環(huán)境中下載的文件是一個(gè)壓縮的.zip文件。

2.安裝

右鍵單擊下載的壓縮文件，進(jìn)行解壓。

解壓完成后里面有一個(gè)名為的文件夾。

解壓完成后，雙擊文件夾：

雙擊.exe應(yīng)用程序文件啟動(dòng)編輯器：

由于它是綠色軟件，所以沒有桌面快捷方式和開始菜單快速啟動(dòng)程序，我們可以右鍵點(diǎn)擊.exe文件來創(chuàng)建桌面快捷方式。

小百科：

綠色軟件是指一類小型軟件，其中大部分都是免費(fèi)軟件。最大的特點(diǎn)就是軟件無需安裝即可使用，可以存放在閃存中，刪除后不會(huì)在本地計(jì)算機(jī)留下任何記錄。通俗的講，綠色軟件就是指下載后不需要安裝就可以直接使用的軟件。綠色軟件不會(huì)在注冊表中留下注冊表鍵值，所以相對于一般的軟件來說，綠色軟件對系統(tǒng)幾乎沒有影響，所以是一類非常優(yōu)秀的軟件。

3. 新建項(xiàng)目

編輯器首次啟動(dòng)時(shí)的默認(rèn)界面如下圖：

如下圖所示，可以新建一個(gè)空白項(xiàng)目，項(xiàng)目名稱為demo1：

成功創(chuàng)建一個(gè)名為demo1的空白項(xiàng)目后的界面如下所示：

接下來在我們剛剛創(chuàng)建的demo1項(xiàng)目中創(chuàng)建一個(gè)名為

右鍵點(diǎn)擊創(chuàng)建的demo1項(xiàng)目，選擇新建，然后選擇.html文件：

在彈出的對話框中填入HTML文件的名稱：

寫一段代碼：

跑步：

觀察瀏覽器上的效果：

好了，HTML開發(fā)環(huán)境的設(shè)置和安裝教程到此結(jié)束。

接下來教大家如何修改主題風(fēng)格，提供了修改軟件主題的功能，用戶可以根據(jù)自己的需求和喜好來修改風(fēng)格，在自己喜歡的環(huán)境中做開發(fā)也是一件很讓人羨慕的事情。

按照以下步驟修改主題。默認(rèn)主題為 Green Soft，可以更改為 Black、 Blue 或自定義主題：

彌黑主題：

典雅藍(lán)色主題：

好了sublime text 小程序，這一節(jié)就結(jié)束了。希望我準(zhǔn)備的內(nèi)容對你們有幫助。

你們的支持就是我最大的動(dòng)力，如果覺得我的教程能幫到你，請點(diǎn)贊關(guān)注我吧！謝謝！

如有侵權(quán)請聯(lián)系刪除！