HTML5網(wǎng)站建設(shè)文檔結(jié)構(gòu),青島設(shè)計(jì)公司,青島網(wǎng)站設(shè)計(jì),青島VI設(shè)計(jì),青島網(wǎng)站建設(shè),山東網(wǎng)站建設(shè),青島網(wǎng)站制作,網(wǎng)站建設(shè)設(shè)計(jì)

HTML5網(wǎng)站建設(shè)文檔結(jié)構(gòu)

分類：瀏覽次數(shù)：44640 2018-10-30 00:00:00

滿意回答

2018-10-30 00:00:00

制作網(wǎng)站最基礎(chǔ)的兩個(gè)規(guī)范分別稱為HTML和CSS，它們?cè)诰W(wǎng)站中起著不同的作用。圭谷設(shè)計(jì)正是圍繞著這兩個(gè)內(nèi)容進(jìn)行講解的，今天首先對(duì)HTML進(jìn)行講解，這里將介紹HTML的基本概念以及一些簡(jiǎn)單的應(yīng)用。此外，Dreamweaver是目前流行的網(wǎng)站制作軟件之一，因此今天的穩(wěn)重中圭谷設(shè)計(jì)還會(huì)對(duì)Dreamweaver軟件的使用進(jìn)行一些簡(jiǎn)單的介紹。通過(guò)學(xué)習(xí)，大家將會(huì)清楚地了解HTML語(yǔ)言在網(wǎng)絡(luò)中所處的位置，這樣從總體上把握HTML，并熟悉Dreamweaver軟件的基本操作。

1223

一.HTML簡(jiǎn)介

前面提到過(guò)網(wǎng)站的基礎(chǔ)是HTML，全稱為Hypertext Markup Language，譯為超文本標(biāo)記語(yǔ)言。首先應(yīng)該明確一個(gè)概念，HTML不是一種編程語(yǔ)言，而是一種描述性的標(biāo)記語(yǔ)言，用于描述超文本中內(nèi)容的顯示方式。比如如何在網(wǎng)站中定義一個(gè)標(biāo)題、一段文本或者一個(gè)表格等，這些都是利用一個(gè)個(gè)HTML標(biāo)記完成的。其最基本的語(yǔ)法就是：<標(biāo)記>內(nèi)容</標(biāo)記>。

標(biāo)記通常都是成對(duì)使用的，有一個(gè)開(kāi)頭標(biāo)記就對(duì)應(yīng)有一個(gè)結(jié)束標(biāo)記。結(jié)束標(biāo)記只是在開(kāi)頭標(biāo)記的前面加一個(gè)斜杠“/”。當(dāng)瀏覽器從服務(wù)器接收到HTML文件后，就會(huì)解釋里面的標(biāo)記符，然后把標(biāo)記符相對(duì)應(yīng)的功能表達(dá)出來(lái)。青島網(wǎng)站建設(shè)美學(xué)體驗(yàn)的原則

例如，在HTML中以<p></p>標(biāo)記來(lái)定義一個(gè)文本段落，以<table></table>標(biāo)記來(lái)定義一個(gè)表格。當(dāng)瀏覽器碰到<p></p>標(biāo)記時(shí)，就會(huì)把<p></p>標(biāo)記之間的所有文字以一個(gè)段落的樣式顯示出來(lái)。再進(jìn)一步，上面說(shuō)的<p>標(biāo)記和<table>標(biāo)記都屬于結(jié)構(gòu)標(biāo)記，也就是它們用于定義網(wǎng)站內(nèi)容的結(jié)構(gòu)。此外，還有一類標(biāo)記，稱為形式標(biāo)記，用于定義網(wǎng)站內(nèi)容的形式。比如瀏覽器遇到<b></b>標(biāo)記時(shí)，就會(huì)把<b></b>標(biāo)記中的所有文字以粗體樣式顯示出來(lái)。或者，有“<i>網(wǎng)站</i>”這樣一個(gè)HTML語(yǔ)句，其顯示結(jié)果就是斜體的“網(wǎng)站”兩個(gè)字。大家可以看到，HTML就是這樣易學(xué)易用。

總的原則就是，用什么樣的標(biāo)記就能得到什么樣的效果。希望獲得什么效果，就用相應(yīng)的標(biāo)記即可。因此，學(xué)習(xí)HTML實(shí)際上就是學(xué)習(xí)如何使用各種HTML的標(biāo)記。

二.創(chuàng)建第一個(gè)HTML文件

人們經(jīng)常在有意無(wú)意中使用網(wǎng)站這個(gè)概念，那么網(wǎng)站的本質(zhì)是什么呢？實(shí)際上網(wǎng)站就是一個(gè)文件，只不過(guò)這個(gè)文件是利用HTML寫成的，所以又被稱為HTML文件。HTML文件的本質(zhì)就是一個(gè)文本文件，只是擴(kuò)展名為“.htm”或“.html”的文本文件。所以，可以利用任何文本編輯軟件創(chuàng)建、編輯HTML文件。在Windows操作系統(tǒng)中，最簡(jiǎn)單的文本編輯軟件就是NotePad（記事本）。

現(xiàn)在我們來(lái)創(chuàng)建自己的第一個(gè)HTML文件。HTML文件的創(chuàng)建方法非常簡(jiǎn)單。具體的操作步驟如下。

1.選擇“開(kāi)始”，然后依次選擇“程序→附件→記事本”命令。

2.在打開(kāi)的記事本窗口中寫入如下代碼。

3.編寫完成后保存該文檔。選取記事本菜單欄中的“文件→保存”命令，彈出“另存為”對(duì)話框。要特別注意，應(yīng)首先在“保存類型”下拉列表中選擇“所有文件”選項(xiàng)，然后再在“文件名”文本框中輸入一個(gè)文件名，并以“.htm”或者“.html”作為文件名的后綴。修改后綴名注意如果這里不改成“所有文件”，記事本程序會(huì)自動(dòng)在文件名后面加上“.txt”后綴，這樣瀏覽器就不會(huì)把這個(gè)文件當(dāng)做網(wǎng)站文件對(duì)待了。

4.設(shè)置完成后單擊“保存”按鈕，這時(shí)該文本文件就變?yōu)榱薍TML文件，在Windows中，可以看到它的圖標(biāo)就是網(wǎng)站文件的圖標(biāo)了。

5.這時(shí)雙擊該HTML文件，就會(huì)自動(dòng)打開(kāi)瀏覽器，并顯示該文件的內(nèi)容。這就是我們制作的第一個(gè)HTML文件，盡管它只有一行文字，但這就標(biāo)志著我們已經(jīng)邁出了走進(jìn)互聯(lián)網(wǎng)世界的第一步！

說(shuō)明

由于HTML文件本質(zhì)上就是文本文件，因此使用任何文本編輯軟件都可以對(duì)它進(jìn)行編輯。當(dāng)然Dreamweaver是最常用的專業(yè)網(wǎng)站建設(shè)編輯軟件之一，但是在這一節(jié)中，我們?nèi)匀皇褂米詈?jiǎn)單的記事本，來(lái)編寫和編輯HTML文檔，目的是通過(guò)最基本的操作，盡可能深入地掌握HTML的原理。

三、HTML文件結(jié)構(gòu)

在上面的HTML文件里用到了5個(gè)HTML標(biāo)記，下面就依次講解它們的作用。實(shí)際上，它們構(gòu)成了最簡(jiǎn)單的完整的HTML文件結(jié)構(gòu)。

1．<html>標(biāo)記<html>標(biāo)記放在HTML文件的開(kāi)頭，并沒(méi)有什么實(shí)質(zhì)性的功能，只是一個(gè)形式上的標(biāo)記，但還是希望大家形成一個(gè)良好的編寫習(xí)慣，在HTML文件開(kāi)頭使用<html>標(biāo)記來(lái)做一個(gè)形式上的開(kāi)始。

2．<head>標(biāo)記<head>也稱為頭標(biāo)記，一般放在<html>標(biāo)記里，其作用是放置關(guān)于此HTML文件的信息，如提供索引、定義CSS樣式等。

3．<title>標(biāo)記<title>稱為標(biāo)題標(biāo)記，包含在<head>標(biāo)記內(nèi)，它的作用是設(shè)定網(wǎng)站標(biāo)題，可以看見(jiàn)在瀏覽器左上方的標(biāo)題欄中顯示這個(gè)標(biāo)題，此外，在Windows任務(wù)欄中顯示的也是這個(gè)標(biāo)題。

4．<body>標(biāo)記<body>又稱為主體標(biāo)記，網(wǎng)站所要顯示的內(nèi)容都放在這個(gè)標(biāo)記內(nèi)，它是HTML文件的重點(diǎn)所在。在后面的新聞中所介紹的HTML標(biāo)記都將在這個(gè)標(biāo)記內(nèi)。然而它并不僅僅是一個(gè)形式上的標(biāo)記，它本身也可以控制網(wǎng)站的背景顏色或背景圖像，這將在后面的圭谷官網(wǎng)新聞中進(jìn)行介紹。另外在構(gòu)建HTML框架的時(shí)候要注意一個(gè)問(wèn)題，標(biāo)記是不可以交錯(cuò)的，否則將會(huì)造成錯(cuò)誤。

沒(méi)有二維碼的