Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537
TML教程
超文本標(biāo)記語(yǔ)言(英語(yǔ):HyperText Markup Language,簡(jiǎn)稱:HTML)是一種用于創(chuàng)建網(wǎng)頁(yè)的標(biāo)準(zhǔn)標(biāo)記語(yǔ)言。
您可以使用 HTML 來(lái)建立自己的 WEB 站點(diǎn),HTML 運(yùn)行在瀏覽器上,由瀏覽器來(lái)解析。
在本教程中,您將學(xué)習(xí)如何使用 HTML 來(lái)創(chuàng)建站點(diǎn)。
HTML 很容易學(xué)習(xí)!相信您能很快學(xué)會(huì)它!
本教程包含了數(shù)百個(gè) HTML 實(shí)例。
使用本站的編輯器,您可以輕松實(shí)現(xiàn)在線修改 HTML,并查看實(shí)例運(yùn)行結(jié)果。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>孫叫獸的博客</title>
</head>
<body>
<h1>我的第一個(gè)標(biāo)題</h1>
<p>我的第一個(gè)段落。</p>
</body>
</html>
HTML 文檔的后綴名
.html
.htm
都可以。
實(shí)例:
<!doctype html>
<html>
<header>
<meta charset="utf-8">
<title>孫叫獸的博客</title>
</header>
<body>
<h1>這是我的標(biāo)題</h1>
<p>這是我的段落</p>
</body>
</html>
實(shí)例解析
什么是HTML?
標(biāo)簽
<標(biāo)簽>內(nèi)容</標(biāo)簽>
html元素
“HTML 標(biāo)簽” 和 “HTML 元素” 通常都是描述同樣的意思.
但是嚴(yán)格來(lái)講, 一個(gè) HTML 元素包含了開(kāi)始標(biāo)簽與結(jié)束標(biāo)簽,如下實(shí)例:
HTML 元素:
<p>這是一個(gè)段落</p>
web瀏覽器
Web瀏覽器(如谷歌瀏覽器,Internet Explorer,F(xiàn)irefox,Safari)是用于讀取HTML文件,并將其作為網(wǎng)頁(yè)顯示。
瀏覽器并不是直接顯示的HTML標(biāo)簽,但可以使用標(biāo)簽來(lái)決定如何展現(xiàn)HTML頁(yè)面的內(nèi)容給用戶
html網(wǎng)頁(yè)結(jié)構(gòu)
<html>
<head>
<title>頁(yè)面標(biāo)題</title>
</head>
<body>
<h1>這是一個(gè)標(biāo)題</h1>
<p>這是一個(gè)段落。</p>
<p>這是另外一個(gè)段落。</p>
</body>
</html>
html的版本:
<!DOCTYPE>聲明
<!DOCTYPE>聲明有助于瀏覽器中正確顯示網(wǎng)頁(yè)。
網(wǎng)絡(luò)上有很多不同的文件,如果能夠正確聲明HTML的版本,瀏覽器就能正確顯示網(wǎng)頁(yè)內(nèi)容。
doctype 聲明是不區(qū)分大小寫(xiě)的,以下方式均可:
<!DOCTYPE html>
<!DOCTYPE HTML>
<!doctype html>
<!Doctype Html>
html5
<!DOCTYPE html>
html4
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML4 Transitional//EN""
http://www.w3.org/TR/html4/loose.dtd">
xhtml1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
中文編碼
目前在大部分瀏覽器中,直接輸出中文會(huì)出現(xiàn)中文亂碼的情況,這時(shí)候我們就需要在頭部將字符聲明為 UTF-8。
tml+css基礎(chǔ)一:html簡(jiǎn)介和發(fā)展史
HTML全稱(hypertext markup language)譯為超文本標(biāo)記語(yǔ)言,其譯文代表了HTML的含義,它和其他編程語(yǔ)言不同的是,HTML不是一門真正意義上編程語(yǔ)言,而是一種標(biāo)記語(yǔ)言,通過(guò)帶有尖角號(hào)的標(biāo)簽對(duì)文本進(jìn)行標(biāo)記,從而實(shí)現(xiàn)網(wǎng)頁(yè)的結(jié)構(gòu)搭建。
1.2、HTML發(fā)展史
HTML創(chuàng)始人(蒂姆·伯納斯-李)蒂姆·伯納斯-李除了是HTML的創(chuàng)始人,還是w3c組織的主席。
1、HTML1.0 (1991年12月)
1991年萬(wàn)維網(wǎng)(www)在互聯(lián)網(wǎng)上首次露面,也隨之引起了巨大的轟動(dòng)。
1989年,伯納斯-李寫(xiě)了一份備忘錄,提出建立一個(gè)基于互聯(lián)網(wǎng)的超文本系統(tǒng)。同年和另外一個(gè)工程師一起進(jìn)行聯(lián)合資金申請(qǐng),但是這個(gè)項(xiàng)目并沒(méi)有通過(guò)。
1991年底的時(shí)候,伯納斯-李公開(kāi)了一份“HTML Tag”的文檔,里面描述了組成HTML初始版本的18個(gè)元素
2、HTML2.0(1995年11月)
HTML 2.0是HTML語(yǔ)言的擴(kuò)展。????
與原始版本的HTML不同,HTML 2.0被創(chuàng)建為Web標(biāo)準(zhǔn),規(guī)定了常見(jiàn)的網(wǎng)頁(yè)結(jié)構(gòu)
3、HTML3.2(1996年1月)
慘淡的"第一次瀏覽器大戰(zhàn)時(shí)期(Netspace Vs IE)",兩大巨頭不斷推出重大舉措試圖控制整個(gè)領(lǐng)域。???????
網(wǎng)頁(yè)開(kāi)發(fā)者是這場(chǎng)戰(zhàn)爭(zhēng)中的焦點(diǎn)。商業(yè)戰(zhàn)爭(zhēng)就像軍備競(jìng)賽,各家公司為了保持領(lǐng)先,招兵買馬。各家都有各家的規(guī)則。?????????
那時(shí)候,你不得不寫(xiě)兩份不同的網(wǎng)頁(yè),一個(gè)用于網(wǎng)景的瀏覽器,另一個(gè)用于微軟的瀏覽器
4、HTML4(1997年12月)
瀏覽器大戰(zhàn)接近尾聲,W3C(世界萬(wàn)維網(wǎng)聯(lián)盟)成立,他們打算通過(guò)制定統(tǒng)一的HTML標(biāo)準(zhǔn),使整個(gè)產(chǎn)業(yè)能有序的發(fā)展。 ? ? ? ? ? ?
他們計(jì)劃用兩種語(yǔ)言分離出HTML的表達(dá)式(HTML 4.0)和結(jié)構(gòu)(CSS),并且說(shuō)服瀏覽器廠商接受這些標(biāo)準(zhǔn)
這次發(fā)布提供了規(guī)范的三種變體:
Strict,嚴(yán)格版本;
Transitional,過(guò)渡版本;
Frameset,iframe框架集;
HTML4.0 采納了許多瀏覽器特定的元素類型及屬性,但是同時(shí)也把 Netscape 的視覺(jué)化標(biāo)記標(biāo)記為過(guò)時(shí)的尋求淘汰; 贊成使用樣式表; 同時(shí)在1998年4月對(duì)HTML4.0進(jìn)行了微小的修訂,沒(méi)有增加版本號(hào)HTML5.0
5、HTML4.01(1999年12月)
像 HTML4.0 一樣提供了三種變體,并且他的最終錯(cuò)誤修訂版在2001年的5月12日發(fā)布
6、XHTML 1.0(2000年1月)
各大瀏覽器廠商紛紛接受W3C標(biāo)準(zhǔn)的時(shí)候,新技術(shù)出現(xiàn)了。?????????????
HTML和另一種語(yǔ)言XML融合,XHTML(可拓展的超文本標(biāo)記語(yǔ)言)就此誕生。???????????
它繼承了HTML的通用型和瀏覽器的兼容性,繼承了XML的嚴(yán)密性和可拓展性
7、HTML5(2014 年 10 月)
HTML5是HTML最新的修訂版本,由W3C制定,目標(biāo)是取代1999年所制定的HTML 4.01和XHTML 1.0標(biāo)準(zhǔn)
我們現(xiàn)在使用的是html5版本,因?yàn)橛捎谛屡d框架的出現(xiàn)和瀏覽器兼容性的提升,讓我們選擇了html5。
HTML 代表超文本標(biāo)記語(yǔ)言。它給出了網(wǎng)站或網(wǎng)頁(yè)的基本結(jié)構(gòu)。它定義了您的網(wǎng)站在結(jié)構(gòu)方面的外觀,即網(wǎng)站包含標(biāo)題、輸入、表單、表格、按鈕等等。
HTML 代碼
<!DOCTYPE html>
<html>
<head>
<title>Hello world</title>
</head>
<body>
<h1>Hello world</h1>
</body>
</html>
您可以在此處查看 Hello world 網(wǎng)站的實(shí)時(shí)版本,其代碼寫(xiě)在上面。
我們將詳細(xì)討論每一行代碼,以便您能夠了解每一行的想法。
這一行基本上告訴網(wǎng)絡(luò)瀏覽器我們正在使用哪個(gè)HTML版本。在本例中我們是HTML5。
這是包含我們網(wǎng)頁(yè)的所有代碼的HTML元素。換句話說(shuō),這包含了網(wǎng)頁(yè)所需的所有結(jié)構(gòu)和設(shè)置,即外部 CSS、JS、CDN 等。您可能會(huì)注意到所有內(nèi)容都位于<html>和之間</html>。這是因?yàn)檫@樣所有的內(nèi)容都會(huì)在這些元素之間。<html>通常指的是開(kāi)始標(biāo)簽,</html>通常指的是結(jié)束標(biāo)簽。
該元素包含了網(wǎng)頁(yè)的所有要求。例如,如果您想添加一些外部 CSS 文件、外部 JS 文件或一些外部 CDN(這是網(wǎng)站的要求),那么此元素就會(huì)派上用場(chǎng)。如果您不了解 CSS,它用于樣式目的,JS 用于功能目的,CDN 代表內(nèi)容交付網(wǎng)絡(luò)。
該元素包含顯示在Web 瀏覽器選項(xiàng)卡中的標(biāo)題。如果您訪問(wèn) Hello world 網(wǎng)站,您會(huì)注意到網(wǎng)絡(luò)瀏覽器的選項(xiàng)卡中有標(biāo)題。這是這些標(biāo)簽的主要工作。Hello world<title>...</title>
該元素包含用戶可見(jiàn)的結(jié)構(gòu)。您可以想象到的上述元素可以用于我們網(wǎng)頁(yè)的設(shè)置。主要內(nèi)容進(jìn)入正文部分。
h1是用于標(biāo)題的標(biāo)題元素。如果您訪問(wèn) hello world 網(wǎng)站,我們可以看到的 hello world 就是標(biāo)題。h1不僅僅是我們擁有的標(biāo)題元素。我們有一個(gè)標(biāo)題元素,從 開(kāi)始h1,直到 ,h6唯一的區(qū)別是h1較大,然后尺寸減小,直到 h6。
如果您想了解有關(guān) HTML 元素的更多信息,可以在此處查看。
<table>
<tr>
<th>S.No.</th>
<th>Day</th>
</tr>
<tr>
<td>1</td>
<td>Sunday</td>
</tr>
<tr>
<td>2</td>
<td>Monday</td>
</tr>
<tr>
<td>3</td>
<td>Tuesday</td>
</tr>
<tr>
<td>4</td>
<td>Wednesday</td>
</tr>
<tr>
<td>5</td>
<td>Thursday</td>
</tr>
<tr>
<td>6</td>
<td>Friday</td>
</tr>
<tr>
<td>7</td>
<td>Saturday</td>
</tr>
</table>
table:這是用于創(chuàng)建表格的表格元素。
tr:表示表格行。即表的行。
td:表示表數(shù)據(jù)。即包含該表的數(shù)據(jù)。
您可以在此處查看代碼的實(shí)時(shí)版本。
注意此代碼必須寫(xiě)在body元素之間。
當(dāng)您上網(wǎng)時(shí),您可能見(jiàn)過(guò)一些 HTML 表單。讓我們來(lái)創(chuàng)建我們自己的 HTML 表單。
這是代碼片段。
<form>
Name: <input type="text" name="name"><br>
Email: <input type="email" name="email"><br>
<input type="submit" value="Submit">
</form>
form:HTML 元素幫助我們創(chuàng)建 HTML 表單。
input:輸入元素允許我們獲取用戶的輸入。和稱為HTML 屬性type="email"。name="email"
您可以在此處查看該網(wǎng)頁(yè)的實(shí)時(shí)版本。
注意此代碼必須寫(xiě)在body元素之間。
總之,HTML 通過(guò)定義其結(jié)構(gòu)作為網(wǎng)站或網(wǎng)頁(yè)的基礎(chǔ)。它決定了網(wǎng)站在標(biāo)題、表單、表格、按鈕等元素方面的顯示方式。通過(guò)使用 HTML 標(biāo)簽和元素,我們可以創(chuàng)建結(jié)構(gòu)良好且組織良好的網(wǎng)頁(yè)。
*請(qǐng)認(rèn)真填寫(xiě)需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。