認識HTML語言並在DW中建立站點

今天小編帶領大家走進我們華信智原前端老師的課堂,一起了解HTML的相關知識,本次分享是第一節課哦,後續還會陸續更新全部課程知識,歡迎大家點擊關注我們,一起學習前端吧!

這節課的目標是認識HTML是什麼以及學會在DW中建立站點,併發布自己的第一個html頁面。

一、認識HTML

HTML概念:超本文標記語言(HyperText Markup Language)

超文本:瀏覽器就可以解釋的,比如http(超文本傳輸協議)。官方解釋:“超文本”就是指頁面內可以包含圖片、鏈接,甚至音樂、程序等非文字元素。

標記語言: 由一個一個的標記組成的語言。比如段落是

這個標記表示,圖像是由這個標記表示。超鏈接是 標記表示。學習標記語言的關鍵是明白網頁的元素(佈局、結構、內容等)應該由什麼標記來描述是最恰當的。

我們要讓瀏覽器按照人的思維來顯示網頁,就必須掌握瀏覽器解釋網頁的html語言,明白標籤的作用,比如你想產生段落,就必須用

段落內容

的方式才能實現。
認識HTML語言並在DW中建立站點

HTML的歷史

超文本標記語言(第一版)——在1993年6月作為互聯網工程工作小組(IETF)工作草案發布(並非標準):

HTML 2.0——1995年11月作為RFC 1866發佈,在RFC 2854於2000年6月發佈之後被宣佈已經過時

HTML 3.2——1997年1月14日,W3C推薦標準

HTML 4.0——1997年12月18日,W3C推薦標準

HTML 4.01(微小改進)——1999年12月24日,W3C推薦標準

XHTML1.0——發佈於2000年1月26日,是W3C推薦標準,後來經過修訂於2002年8月1日重新發布。

XHTML 1.1,於2001年5月31日發佈,W3C推薦標準。

XHTML 2.0,W3C工作草案。

HTML4.01 是常見的版本。

XHTML 5,從XHTML 1.x的更新版,基於HTML 5草案。

HTML 5——2014年10月28日,W3C推薦標準

HTML標記的語法

標記只有兩種語法結構,一種包容標記,一種空標記。

1、包容標記 ...結束標記>,比如

...

等。

2、空標記 ,比如


等。

標記的屬性只能放在開始標記裡面。

1、

2、替換文本

在DW的"插入"菜單——標籤中,可以看到所有的html標籤,如下圖:

認識HTML語言並在DW中建立站點

並不是所有標籤都是有用的,有些標籤隨著版本的升級會廢除,但是並沒有刪除,所以真正有用的標籤只有那麼幾十個。

二、在DW中建立站點,併發布第一個HTML頁面

基本步驟如下:

1、建立站點,設置好根目錄文件夾和默認圖片文件夾(非常重要)。

2、新建html頁面,並保存在根目錄文件夾下面。

3、再往保存好的頁面中添加內容,比如文字和圖片、超鏈接等。

詳細介紹如下:

1、點擊“管理站點”,在彈出的面板中點擊“新建站點”,如圖:

認識HTML語言並在DW中建立站點

認識HTML語言並在DW中建立站點

2、設置“站點名稱”和“本地站點文件夾”,本地站點文件夾就是你存放整個網站的根目錄,點擊後面的文件夾小圖標,選擇一個盤符,新建一個文件夾,選擇好就可以了。比如,選擇F盤下面的lianxi文件夾。

認識HTML語言並在DW中建立站點

3、這一步非常關鍵,必須要設置“默認圖像文件夾”,點擊“高級設置”,再點擊後面的文件夾小圖標,在剛才設置好的“lianxi”根目錄文件夾下面再新建一個“images”文件夾,選擇好。要保證“images”文件夾必須在你設置的根目錄文件夾的下面。

認識HTML語言並在DW中建立站點

建立這個默認圖像文件夾的好處是從站點以外選擇的圖片,都會自動把圖片複製到這個默認圖像文件夾的下面。保證了站點的所有資源都在站點內部,不會丟失圖片。

否則,如果你沒有設置這個圖像文件夾,每次從站點以外的地方插入圖片,都會有如下提示:

認識HTML語言並在DW中建立站點

4、站點建立好後,就可以新建html頁面,保存併發布了。

按F12發佈的時候,默認是IE瀏覽器,如果想設置為別的瀏覽器,可以編輯瀏覽器列表。如圖所示:

認識HTML語言並在DW中建立站點

2、點擊“+”按鈕,添加要發佈的瀏覽器。

認識HTML語言並在DW中建立站點

3、以谷歌為例,找到谷歌的快捷方式,右鍵菜單中選擇“屬性”。

認識HTML語言並在DW中建立站點

4、複製谷歌的路徑,一定是以“.exe”為後綴名的路徑,這是可執行文件。

認識HTML語言並在DW中建立站點

5、粘貼到應用程序中,設置為“主瀏覽器”,確定即可。

認識HTML語言並在DW中建立站點

6、回到DW中,按下F12,即可看到在谷歌中發佈了網頁。

怎麼樣?這HTML第一課大家學會了嗎?

關注華信智原,樂享更多好課。


分享到:


相關文章: