TML教程
超文本標記語言(英語:HyperText Markup Language,簡稱:HTML)是一種用于創建網頁的標準標記語言。
您可以使用 HTML 來建立自己的 WEB 站點,HTML 運行在瀏覽器上,由瀏覽器來解析。
在本教程中,您將學習如何使用 HTML 來創建站點。
HTML 很容易學習!相信您能很快學會它!
本教程包含了數百個 HTML 實例。
使用本站的編輯器,您可以輕松實現在線修改 HTML,并查看實例運行結果。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>孫叫獸的博客</title>
</head>
<body>
<h1>我的第一個標題</h1>
<p>我的第一個段落。</p>
</body>
</html>
HTML 文檔的后綴名
.html
.htm
都可以。
實例:
<!doctype html>
<html>
<header>
<meta charset="utf-8">
<title>孫叫獸的博客</title>
</header>
<body>
<h1>這是我的標題</h1>
<p>這是我的段落</p>
</body>
</html>
實例解析
什么是HTML?
標簽
<標簽>內容</標簽>
html元素
“HTML 標簽” 和 “HTML 元素” 通常都是描述同樣的意思.
但是嚴格來講, 一個 HTML 元素包含了開始標簽與結束標簽,如下實例:
HTML 元素:
<p>這是一個段落</p>
web瀏覽器
Web瀏覽器(如谷歌瀏覽器,Internet Explorer,Firefox,Safari)是用于讀取HTML文件,并將其作為網頁顯示。
瀏覽器并不是直接顯示的HTML標簽,但可以使用標簽來決定如何展現HTML頁面的內容給用戶
html網頁結構
<html>
<head>
<title>頁面標題</title>
</head>
<body>
<h1>這是一個標題</h1>
<p>這是一個段落。</p>
<p>這是另外一個段落。</p>
</body>
</html>
html的版本:
<!DOCTYPE>聲明
<!DOCTYPE>聲明有助于瀏覽器中正確顯示網頁。
網絡上有很多不同的文件,如果能夠正確聲明HTML的版本,瀏覽器就能正確顯示網頁內容。
doctype 聲明是不區分大小寫的,以下方式均可:
<!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">
中文編碼
目前在大部分瀏覽器中,直接輸出中文會出現中文亂碼的情況,這時候我們就需要在頭部將字符聲明為 UTF-8。
互聯網高速發展的今天,我們通過瀏覽器可以看到各種各樣的網站,包含了各式不同的領域還有內容,通過點擊網站上的標簽和欄目我們就能夠很方便地看到網站上顯示的各種數據,而這些都是建立在HTML這種標記語言的基礎上做到的。
HTML的英文全稱為Hyper Text Markup Language,中文稱作超文本標記語言,是一種專門用來建立網站的標識語言。其中包括了許多標簽將分散的網絡數據連接到一起,聚合同一之后形成了我們現在所看到的網頁。
看到這里是不是有許多朋友想要知道這個HTML語言該怎么去學習呢?是需要找老師統一學,還是去圖書館找專業書籍自己學好呢?不用擔心,因為今天要給大家推薦的就是一個專門為大家提供各種編程語言教程的學習網站。
這個網站名叫 runoob,直接在瀏覽器上搜索即可找到。
圖片來自RUNOOB網頁截圖
在首頁可以看到該欄目的第二個就是關于HTML的學習教程,點擊左邊的方框可以調整你的課程進度,在第一章節的教程中很清晰地講解了什么是HTML,以及告訴了你一些關于網站建立的小知識。
下方的提示框會給你提供一些對HTML零基礎新手的科普,關于這種標記語言應該如何進行保存,如何查看文件后輟名,如何打開代碼文件等等,還會提供一些專用工具供你學習使用。同時網站會給你簡單介紹一些網頁編程語言的區別,還有各種用途上的區分,非常地詳細。
圖片來自RUNOOB網頁截圖
在第三章節的編輯器一欄里,會提供給你一些HTML的專用編輯器,例如VS Code,還有sublime text 等實用工具,在后面會教你如何將這些HTML必備編輯器下載并安裝,然后在瀏覽器上面運行。
通過插件還有語言編程的格式我們就能夠學會如何制作第一步的標題了,剛開始的一步比較簡單,相信大家很快就能學會如何在網頁上顯示自己打入的文字了。之后進一步的學習就是關于如何調整文字段落,還有各種標識的使用。
圖片來自RUNOOB網頁截圖
在如何進行文字排版編輯的方面,教程中也講述得很詳細,包括一些用戶們常犯的錯誤,還有一些網頁的實例,甚至是這個教學網站上的排版示范都會進行一一講解。
更深入的章節會對如何進行圖像排列,傳輸等方面進行細講,教程中把大部分網站會使用到的技巧還有排版方式都分成了許多個小片段,方便大家能夠對每個方面針對性地學習。這些內容并不多,幾乎每一個片段都是用很直白的語言進行講解,方便所有人都能夠看懂,并且在下方都會有更詳細的術語解析,還有一些比較難懂的點會舉例解釋。
圖片來自RUNOOB網頁截圖
經過十幾章節的教學之后,基本上能夠掌握HTML語言的基本用法,還有一些簡單的操作了,這個時候如果想要進階學習的話還可以在網站上查找其他的進階語言用法,例如CSS, JavaScript等等復雜一些的語言,相應的你也會學到更多如何運營網頁的方法。
當然如果想要自己建立一個網站的話,還需要更多資源還有設備,例如高速的網絡連接保持網頁的穩定性,以及穩定的服務器,用來保證自己的網頁24小時都能保持流暢可用。不過這些都是在學會了如何建立網頁之后才考慮的事了。
現在網上也有許多編程教學,在網上自學一門知識一門語言變得非常方便,但是僅僅是擁有資源還是不夠的。學習如何建立自己的網站還需要大量的努力以及知識的積累,通過不斷的練習還有實踐才能自如地使用,只有基礎扎實,建立出來的網站才能夠長久。但還需要大家能夠行動起來,只有去學習去實踐才能夠真正學會東西,希望這個教學網站推薦能夠幫到更多人!
多朋友想學一下網頁制作,上網一看,只要涉及到網頁制作,都離不開HTML這個詞語,HTML是HyperText Markup Language的簡稱,想學習HTML語言,先得了解一些基本知識,今天這邊內容可以作為學習HTML的菜鳥教程第一課。
HTML是什么?
一般我們說HTML是指超文本標記語言,英文名稱為HyperText Markup Language,簡稱HTML,它是目前互聯網上應用最廣泛的語言。
如何查看HTML?
拿最常見的網頁為例,如果用大家熟悉的IE瀏覽器的話,直接在網頁上點右鍵,選擇“查看源”即可查看當前網頁的HTML源碼;如果是其他瀏覽器的話,多數情況下點擊右鍵,選擇“查看源碼”或者類似“查看網頁源代碼”這樣的選項即可查看。
當然也可以通過專業的網頁制作軟件以及各種文本編輯器來查看。
HTML有什么用?
HTML語言可以方便地將網絡上存儲于不同位置的文字、圖片、聲音、視頻等內容組織起來,方便用戶瀏覽。對于我們來說,HTML是學習網頁制作的基本功,熟練掌握HTML這項基本功,可以為以后的學習和工作打下良好的基礎。
HTML如何入門?
要學習任何編程語言,都不好好高騖遠,HTML的入門很簡單,但是也要遵循學習的基本步驟,選擇一本入門書籍,循序漸進地去學習每一張的內容。一邊學習,一邊查看網頁代碼對照來學,提升入門速度。
HTML案例
下面就是最基本的HTML案例,在這個案例中,用的是HTML5,
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML菜鳥教程(runoob.com)</title>
</head>
<body>
<h1>我的第一個標題</h1>
<p>我的第一個段落。</p>
</body>
</html>
如何編輯HTML?
這個就很多了 ,比如最出名的Dreamweaver,當然如果熟練之后,可以選擇任意自己喜歡的編輯器,一些小的改動或者一小段代碼的話,也可以用各種常見的文本編輯器來處理,比如我們在wodows系統上常見的記事本,總之只要自己覺得方便就好。
總結
以上是學習HTML菜鳥教程的第一課,首先保持一個良好的心態來學習,有好的心態,知識方面只要循序漸進,學會就是水到渠成的事情了 。
*請認真填寫需求信息,我們會在24小時內與您取得聯系。