整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
HTML文檔由HTML元素組成，一個HTML元素由一個標簽和一組屬性組成。一個標簽可以有一個或多個屬性，屬性以名稱和值成對出現。Web 瀏覽器讀取HTML 文檔，并以網頁的形式顯示出來，瀏覽器不會顯示 HTML 標簽，而是通過標簽來解釋網頁的內容。
HTML(Hyper Text Mark-up Language超文本標記語言)：不是編程語言，而是一種描述性的標記語言，用于描述網頁中內容的顯示方式，比如文字以什么顏色、大小來顯示等，這些都是利用Html標記來實現。
HTML標簽是由尖括號（“<”和“>”）包圍的關鍵詞，如標簽 <p>。標簽不區分大小寫，故 <p> 和 <P> 的含義相同，不過推薦使用小寫。
HTML標簽通常成對出現，一個是開始標簽，一個是結束標簽。開始標簽告訴瀏覽器，從這里開始執行該標簽所表示的功能；結束標簽告訴瀏覽器，該功能到這里結束。在開始標簽前加一個斜杠（/）即成為結束標簽。如，html 元素的開始標簽是 <html>，結束標簽是</html>。也就是說，一個HTML 元素由開始標簽、內容、結束標簽組成。開始標簽是放在一對尖括號中的元素名稱及可能包含的屬性，結束標簽是放在一對尖括號中的斜杠加元素的名稱。語法格式為：<開始標簽>內容</結束標簽>。如，em 元素的開始標簽為<em>，結束標簽為 </em>，在<em> 和 </em> 標簽之間是元素的內容。如下圖所示：
所有的網頁文件，通過都是四對標記來構成文檔的骨架，它們是：
小結：
1. 單標記
一．<標記名稱>
單一型，無屬性值
如：<br/>——表示換行符
二．<標記名稱屬性=”屬性值”>
單一型，有屬性值
如：<hr width=”80%”/>
2. 雙標記
三．<標記名稱>…</標記名稱>
沒有屬性值
如：<title>…<title>
四．<標記名稱屬性=”屬性值”>…</標記名稱>
有屬性值
如：<body bgcolor=”red”>…</body>
注釋
格式：
<!—注釋內容-->
Body屬性
<body bgcolor=”背景顏色” background=”背景圖像” text=”文本顏色” link=”鏈接文本顏色” vlink=”訪問過的文本顏色” alink=”激活的連接文本顏色” leftmargin=”左邊界”>
語法：
<font color=”文本顏色” size=“字號”>文本</font>
格式：
<p align=“對齊方式”>…</p>
修飾標記
水平直線<hr/>
有小伙伴私信小編，零基礎入門前端很吃力，許多地方根本不知道應該怎么進行下去。
因此小編收集了一套前端零基礎入門的視頻教程（學完就可以去找工作哦）今天免費分享給大家。
希望小伙伴們可以對照著小編文中提到的知識點一步步學習，最終可以找到適合自己的工作！但還是那句話，如果你不努力，就算有千萬個人幫助你，最終也會一事無成！
教程目錄大綱：
TML基本語法
網頁主要由文字、圖像和超鏈接等元素構成。當然，除了這些元素，網頁中還可以包含音頻、視頻以及Flash等。
瀏覽器是網頁運行的平臺，常用的瀏覽器有IE、火狐（Firefox）、谷歌（Chrome）、Safari和Opera等。我們平時稱為五大瀏覽器。
瀏覽器內核又可以分成兩部分：渲染引擎(layout engineer 或者 Rendering Engine)和 JS 引擎。
渲染引擎 它負責取得網頁的內容（HTML、XML、圖像等等）、整理訊息（例如加入 CSS 等），以及計算網頁的顯示方式，然后會輸出至顯示器或打印機。瀏覽器的內核的不同對于網頁的語法解釋會有不同，所以渲染的效果也不相同。
JS 引擎 則是解析 Javascript 語言，執行 javascript語言來實現網頁的動態效果。
最開始渲染引擎和 JS 引擎并沒有區分的很明確，后來 JS 引擎越來越獨立，內核就傾向于只指渲染引擎。有一個網頁標準計劃小組制作了一個 ACID 來測試引擎的兼容性和性能。內核的種類很多，如加上沒什么人使用的非商業的免費內核，可能會有10多種，但是常見的瀏覽器內核可以分這四種：Trident、Gecko、Blink、Webkit。
（1）Trident(IE內核)
國內很多的雙核瀏覽器的其中一核便是 Trident，美其名曰 "兼容模式"。
代表： IE、傲游、世界之窗瀏覽器、Avant、騰訊TT、獵豹安全瀏覽器、360極速瀏覽器、百度瀏覽器等。
Window10 發布后，IE 將其內置瀏覽器命名為 Edge，Edge 最顯著的特點就是新內核 EdgeHTML。
（2）Gecko(firefox)
Gecko(Firefox 內核)： Mozilla FireFox(火狐瀏覽器) 采用該內核，Gecko 的特點是代碼完全公開，因此，其可開發程度很高，全世界的程序員都可以為其編寫代碼，增加功能。 可惜這幾年已經沒落了， 比如 打開速度慢、升級頻繁、豬一樣的隊友flash、神一樣的對手chrome。
（3） webkit(Safari)
Safari 是蘋果公司開發的瀏覽器，所用瀏覽器內核的名稱是大名鼎鼎的 WebKit。
現在很多人錯誤地把 webkit 叫做 chrome內核（即使 chrome內核已經是 blink 了），蘋果感覺像被別人搶了媳婦，都哭暈再廁所里面了。
代表瀏覽器：傲游瀏覽器3、 Apple Safari (Win/Mac/iPhone/iPad)、Symbian手機瀏覽器、Android 默認瀏覽器，
（4） Chromium/Blink(chrome)
在 Chromium 項目中研發 Blink 渲染引擎（即瀏覽器核心），內置于 Chrome 瀏覽器之中。Blink 其實是 WebKit 的分支。
? 大部分國產瀏覽器最新版都采用Blink內核。二次開發
（5） Presto(Opera)
Presto（已經廢棄） 是挪威產瀏覽器 opera 的 "前任" 內核，為何說是 "前任"，因為最新的 opera 瀏覽器早已將之拋棄從而投入到了谷歌懷抱了。
移動端的瀏覽器內核主要說的是系統內置瀏覽器的內核。
Android手機而言，使用率最高的就是Webkit內核，大部分國產瀏覽器宣稱的自己的內核，基本上也是屬于webkit二次開發。
iOS以及WP7平臺上，由于系統原因，系統大部分自帶瀏覽器內核，一般是Safari或者IE內核Trident的
通過以上瀏覽器的內核不同，我們知道他們工作原理、解析肯定不同，顯示就會有差別。
1、讓Web的發展前景更廣闊
2、內容能被更廣泛的設備訪問
3、更容易被搜尋引擎搜索
4、降低網站流量費用
5、使網站更易于維護
6、提高頁面瀏覽速度
Web標準不是某一個標準，而是由W3C和其他標準化組織制定的一系列標準的集合。
主要包括結構（Structure）、表現（Presentation）和行為（Behavior）三個方面。
結構標準：結構用于對網頁元素進行整理和分類，咱們主要學的是HTML。 最重要
表現標準：表現用于設置網頁元素的版式、顏色、大小等外觀樣式，主要指的是CSS。
行為標準：行為是指網頁模型的定義及交互的編寫，咱們主要學的是
理想狀態我們的源碼： .HTML .css .js
一般先學習HTML+CSS， 這里我們先定一個小目標，先學HTML,后學習CSS。
HTML（英文Hyper Text Markup Language的縮寫）中文譯為“超文本標簽語言”。是用來描述網頁的一種語言。
所謂超文本，因為它可以加入圖片、聲音、動畫、多媒體等內容，不僅如此，它還可以從一個文件跳轉到另一個文件，與世界各地主機的文件連接。
<h1> 我是一個大標題 </h1>注意： 體會 文本 標簽 語言 幾個詞語
總結： HTML 作用就是用標記標簽來描述網頁，把網頁內容在瀏覽器中展示出來。
用文字來描述網頁標簽
日常生活的書信，我們要遵循共同的約定。
同理：HTML 有自己的語言語法骨架格式：
<HTML>
<head>
<title></title>
</head>
<body>
</body>
</HTML>1 HTML標簽：
作用所有HTML中標簽的一個根節點。 最大的標簽 根標簽
2 head標簽： 文檔的頭部
文檔的頭部描述了文檔的各種屬性和信息，包括文檔的標題、在 Web 中的位置以及和其他文檔的關系等。絕大多數文檔頭部包含的數據都不會真正作為內容顯示給讀者。
注意在head標簽中我們必須要設置的標簽是title
3.title標簽： 文檔的標題
作用：讓頁面擁有一個屬于自己的標題。
4.body標簽：文檔的主體 以后我們的頁面內容 基本都是放到body里面的
body 元素包含文檔的所有內容（比如文本、超鏈接、圖像、表格和列表等等。）在HTML頁面中，帶有“< >”符號的元素被稱為HTML標簽，如上面提到的 <HTML>、<head>、<body>都是HTML骨架結構標簽。所謂標簽就是放在“< >” 標簽符中表示某個功能的編碼命令，也稱為HTML標簽或 HTML元素
1.雙標簽
<標簽名> 內容 </標簽名>該語法中“<標簽名>”表示該標簽的作用開始，一般稱為“開始標簽（start tag）”，“” 表示該標簽的作用結束，一般稱為“結束標簽（end tag）”。和開始標簽相比，結束標簽只是在前面加了一個關閉符“/”。
比如 <body>我是文字 </body>2.單標簽
<標簽名 />單標簽也稱空標簽，是指用一個標簽符號即可完整地描述某個功能的標簽。
比如 <br />標簽的相互關系就分為兩種：
1.嵌套關系
<head> <title> </title> </head>2.并列關系
<head></head>
<body></body>倡議： 如果兩個標簽之間的關系是嵌套關系，子元素最好縮進一個tab鍵的身位。如果是并列關系，最好上下對齊。
<!DOCTYPE html> 同學你用啥手機？你咋回答？
這句話就是告訴我們使用哪個html版本？ 我們使用的是 html 5 的版本。 html有很多版本，那我們應該告訴用戶和瀏覽器我們使用的版本號。
<!DOCTYPE> 標簽位于文檔的最前面，用于向瀏覽器說明當前文檔使用哪種 HTML 或 XHTML 標準規范，必需在開頭處使用<!DOCTYPE>標簽為所有的XHTML文檔指定XHTML版本和類型，只有這樣瀏覽器才能按指定的文檔類型進行解析。
注意： 一些老網站可能用的還是老版本的文檔類型比如 XHTML之類的，但是我們學的是HTML5,而且HTML5的文檔類型兼容很好(向下兼容的原則)，所以大家放心的使用HTML5的文檔類型就好了。
utf-8是目前最常用的字符集編碼方式，常用的字符集編碼方式還有gbk和gb2312。
gb2312 簡單中文 包括6763個漢字
BIG5 繁體中文 港澳臺等用
GBK包含全部中文字符 是GB2312的擴展，加入對繁體字的支持，兼容GB2312
UTF-8則包含全世界所有國家需要用到的字符
記住一點，以后我們統統使用UTF-8 字符集, 這樣就避免出現字符集不統一而引起亂碼的情況了。
白話： 所謂標簽語義化，就是指標簽的含義，使用做合適的標簽做做合適的事，比如標題用 h 標簽而不是 div 標簽。
核心：合適的地方給一個最為合理的標簽。
語義是否良好： 當我們去掉CSS之后，網頁結構依然組織有序，并且有良好的可讀性。
白話，一眼看去，就知道那個是重點，結構是什么，知道每塊的內容是干啥的。
遵循的原則：先確定語義的HTML ，再選合適的CSS。
首先 HTML和CSS是兩種完全不同的語言，我們學的是結構，就只寫HTML標簽，認識標簽就可以了。 不會再給結構標簽指定樣式了。
HTML標簽有很多，這里我們學習最為常用的，后面有些較少用的，我們可以查下手冊就可以了。
排版標簽主要和css搭配使用，顯示網頁結構的標簽，是網頁布局最常用的標簽。
單詞縮寫： head 頭部. 標題 title 文檔標題
為了使網頁更具有語義化，我們經常會在頁面中用到標題標簽，HTML提供了6個等級的標題，即
<h1>、<h2>、<h3>、<h4>、<h5>和<h6>
標題標簽語義： 作為標題使用，并且依據重要性遞減其基本語法格式如下：
<hn> 標題文本 </hn>注意： h1 標簽因為重要，盡量少用，不要動不動就向你扔了一個h1。 一般h1 都是給logo使用，或者頁面中最重要標題信息。
單詞縮寫： paragraph 段落
在網頁中要把文字有條理地顯示出來，離不開段落標簽，就如同我們平常寫文章一樣，整個網頁也可以分為若干個段落，而段落的標簽就是
<p> 文本內容 </p>是HTML文檔中最常見的標簽，默認情況下，文本在一個段落中會根據瀏覽器窗口的大小自動換行。
單詞縮寫： horizontal 橫線 [?h?r??zɑntl] 同上
在網頁中常常看到一些水平線將段落與段落之間隔開，使得文檔結構清晰，層次分明。這些水平線可以通過插入圖片實現，也可以簡單地通過標簽來完成，
就是創建橫跨網頁水平線的標簽。其基本語法格式如下：
<hr />是單標簽在網頁中顯示默認樣式的水平線。
單詞縮寫： break 打斷 ,換行
在HTML中，一個段落中的文字會從左到右依次排列，直到瀏覽器窗口的右端，然后自動換行。如果希望某段文本強制換行顯示，就需要使用換行標簽
<br />這時如果還像在word中直接敲回車鍵換行就不起作用了。
div span 是沒有語義的 是我們網頁布局主要的2個盒子 css+div
div 就是 division 的縮寫 分割， 分區的意思 其實有很多div 來組合網頁。
span, 跨度，跨距；范圍
語法格式：
<div> 這是頭部 </div> <span>今日價格</span>在網頁中，有時需要為文字設置粗體、斜體或下劃線效果，這時就需要用到HTML中的文本格式化標簽，使文字以特殊的方式顯示。
屬性就是特性 比如 手機的顏色 手機的尺寸 ，總結就是手機的。。
手機的顏色是黑色 手機的尺寸是 8寸
水平線的長度是 200
圖片的寬度 是 300 鍵 值對
使用HTML制作網頁時，如果想讓HTML標簽提供更多的信息，可以使用HTML標簽的屬性加以設置。其基本語法格式如下：
<標簽名 屬性1="屬性值1" 屬性2="屬性值2" …> 內容 </標簽名>在上面的語法中，
1.標簽可以擁有多個屬性，必須寫在開始標簽中，位于標簽名后面。
2.屬性之間不分先后順序，標簽名與屬性、屬性與屬性之間均以空格分開。
3.任何標簽的屬性都有默認值，省略該屬性則取默認值。
采取 鍵值對 的格式 key="value" 的格式
比如:
<hr width="400" />屬性 是 寬度
值 是 400
提倡： 盡量不使用 樣式屬性。
單詞縮寫： image 圖像
HTML網頁中任何元素的實現都要依靠HTML標簽，要想在網頁中顯示圖像就需要使用圖像標簽，接下來將詳細介紹圖像標簽以及和他相關的屬性。其基本語法格式如下：
該語法中src屬性用于指定圖像文件的路徑和文件名，他是img標簽的必需屬性。
<img src="圖像URL" />單詞縮寫： anchor 的縮寫 [???k?(r)] 。基本解釋 錨, 鐵錨 的
在HTML中創建超鏈接非常簡單，只需用標簽環繞需要被鏈接的對象即可，其基本語法格式如下：
<a href="跳轉目標" target="目標窗口的彈出方式">文本或圖像</a>href：用于指定鏈接目標的url地址，當為標簽應用href屬性時，它就具有了超鏈接的功能。 Hypertext Reference的縮寫。意思是超文本引用
target：用于指定鏈接頁面的打開方式，其取值有_self和_blank兩種，其中_self為默認值，_blank為在新窗口中打開方式。
注意：
1.外部鏈接 需要添加 http:// www.baidu.com
2.內部鏈接 直接鏈接內部頁面名稱即可 比如 < a href="index.html"> 首頁
3.如果當時沒有確定鏈接目標時，通常將鏈接標簽的href屬性值定義為“#”(即href="#")，表示該鏈接暫時為一個空鏈接。
4.不僅可以創建文本超鏈接，在網頁中各種網頁元素，如圖像、表格、音頻、視頻等都可以添加超鏈接。
通過創建錨點鏈接，用戶能夠快速定位到目標內容。
創建錨點鏈接分為兩步：
1.使用“a href=”#id名>“鏈接文本"</a>創建鏈接文本（被點擊的）
<a href="#two">
2.使用相應的id名標注跳轉目標的位置。
<h3 id="two">第2集</h3> base 可以設置整體鏈接的打開狀態
base 寫到 <head> </head> 之間
把所有的連接 都默認添加 target="_blank"
在HTML中還有一種特殊的標簽——注釋標簽。如果需要在HTML文檔中添加一些便于閱讀和理解但又不需要顯示在頁面中的注釋文字，就需要使用注釋標簽。其基本語法格式如下：
?
<!-- 注釋語句 --> ctrl + / 或者 ctrl +shift + / 注釋內容不會顯示在瀏覽器窗口中，但是作為HTML文檔內容的一部分，也會被下載到用戶的計算機上，查看源代碼時就可以看到。
實際工作中，通常新建一個文件夾專門用于存放圖像文件，這時再插入圖像，就需要采用“路徑”的方式來指定圖像文件的位置。
路徑可以分為： 相對路徑和絕對路徑
以引用文件之網頁所在位置為參考基礎，而建立出的目錄路徑。因此，當保存于不同目錄的網頁引用同一個文件時，所使用的路徑將不相同，故稱之為相對路徑。
絕對路徑以Web站點根目錄為參考基礎的目錄路徑。之所以稱為絕對，意指當所有網頁引用同一個文件時，所使用的路徑都是一樣的
“D:\web\img\logo.gif”，或完整的網絡地址，例如
“http://www.itcast.cn/images/logo.gif”
無序列表的各個列表項之間沒有順序級別之分，是并列的。其基本語法格式如下：
<ul>
<li>列表項1</li>
<li>列表項2</li>
<li>列表項3</li>
......
</ul>比如下面這些，新聞是沒有順序的，不用排隊，先到先得，后發布先顯示。
1. <ul></ul>中只能嵌套<li></li>，直接在<ul></ul>標簽中輸入其他標簽或者文字的做法是不被允許的。
2. <li>與</li>之間相當于一個容器，可以容納所有元素。
3. 無序列表會帶有自己樣式屬性，放下那個樣式，一會讓CSS來！有序列表即為有排列順序的列表，其各個列表項按照一定的順序排列定義，有序列表的基本語法格式如下：
<ol>
<li>列表項1</li>
<li>列表項2</li>
<li>列表項3</li>
......
</ol>所有特性基本與ul 一致。
定義列表常用于對術語或名詞進行解釋和描述，定義列表的列表項前沒有任何項目符號。其基本語法如下：
<dl>
<dt>名詞1</dt>
<dd>名詞1解釋1</dd>
<dd>名詞1解釋2</dd>
...
<dt>名詞2</dt>
<dd>名詞2解釋1</dd>
<dd>名詞2解釋2</dd>
...
</dl>在HTML網頁中，要想創建表格，就需要使用表格相關的標簽。創建表格的基本語法格式如下：
<table>
<tr>
<td>單元格內的文字</td>
...
</tr>
...
</table>在上面的語法中包含三對HTML標簽，分別為 <table></table>、<tr></tr>、<td></td>，他們是創建表格的基本標簽，缺一不可，下面對他們進行具體地解釋
1.table用于定義一個表格。
2.tr 用于定義表格中的一行，必須嵌套在 table標簽中，在 table中包含幾對 tr，就有幾行表格。
3.td /td：用于定義表格中的單元格，必須嵌套在<tr></tr>標簽中，一對 <tr> </tr>中包含幾對<td></td>，就表示該行中有多少列（或多少個單元格）。注意：
1. <tr></tr>中只能嵌套<td></td>2. <td></td>標簽，他就像一個容器，可以容納所有的元素
三參為0
即：border cellpadding cellspacing 為 0
表頭單元格一般位于表格的第一行或第一列，其文本加粗居中，如下圖所示，即為設置了表頭的表格。設置表頭非常簡單，只需用表頭標簽<th></th>替代相應的單元格標簽<td></td>即可。
在使用表格進行布局時，可以將表格劃分為頭部、主體和頁腳（頁腳因為有兼容性問題，我們不在贅述），具體 如下所示：
<thead></thead>：用于定義表格的頭部。
必須位于<table></table> 標簽中，一般包含網頁的logo和導航等頭部信息。
<tbody></tbody>：用于定義表格的主體。
位于<table></table>標簽中，一般包含網頁中除頭部和底部之外的其他內容。
表格的標題： caption
定義和用法
caption 元素定義表格標題。
<table>
<caption>我是表格標題</caption>
</table>caption 標簽必須緊隨 table 標簽之后。
只存在 表格里面
您只能對每個表格定義一個標題。通常這個標題會被居中于表格之上。
跨行合并：rowspan 跨列合并：colspan
合并單元格的思想：
? 將多個內容合并的時候，就會有多余的東西，把它刪除。 例如 把 3個 td 合并成一個， 那就多余了2個，需要刪除。
? 公式： 刪除的個數 = 合并的個數 - 1
合并的順序 先上 后下 先左 后右
表單目的是為了收集用戶信息。
在我們網頁中， 我們也需要跟用戶進行交互，收集用戶資料，此時也需要表單。
在HTML中，一個完整的表單通常由表單控件（也稱為表單元素）、提示信息和表單域3個部分構成。
表單控件：
? 包含了具體的表單功能項，如單行文本輸入框、密碼輸入框、復選框、提交按鈕、重置按鈕等。
提示信息：
? 一個表單中通常還需要包含一些說明性的文字，提示用戶進行填寫和操作。
表單域：
? 他相當于一個容器，用來容納所有的表單控件和提示信息，可以通過他定義處理表單數據所用程序的url地址，以及數據提交到服務器的方法。如果不定義表單域，表單中的數據就無法傳送到后臺服務器。
input 輸入的意思
在上面的語法中，<input />標簽為單標簽，type屬性為其最基本的屬性 類型 ，其取值有多種，用于指定不同的控件類型。除了type屬性之外，<input />標簽還可以定義很多其他的屬性，其常用屬性如下表所示。
type 說明了屬于那種表單
radio 如果是一組，我們必須給他們命名相同的名字 name 這樣就可以多個選其中的一個啦
label 標簽為 input 元素定義標注（標簽）。
table
作用： 用于綁定一個表單元素, 當點擊label標簽的時候, 被綁定的表單元素就會獲得輸入焦點
如何綁定元素呢？
for 屬性規定 label 與哪個表單元素綁定。
<label for="male">Male</label>
<input type="radio" name="sex" id="male" value="male">text 文本框 只能寫一行文本呢
textarea 文本域
如果需要輸入大量的信息，就需要用到<textarea></textarea>標簽。通過textarea控件可以輕松地創建多行文本輸入框，其基本語法格式如下：
<textarea cols="每行中的字符數" rows="顯示的行數">
文本內容
</textarea>使用select控件定義下拉菜單的基本語法格式如下 select 選擇
<select>
<option>選項1</option>
<option>選項2</option>
<option>選項3</option>
...
</select>注意：
在HTML中，form標簽被用于定義表單域，即創建一個表單，以實現用戶信息的收集和傳遞，form中的所有內容都會被提交給服務器。創建表單的基本語法格式如下：
<form action="url地址" method="提交方式" name="表單名稱">
各種表單控件
</form>常用屬性：
位小伙伴好，黑客技術離不開代碼，做為一個滲透測試工程師，也一定要有一些代碼基礎。網絡安全行業，現在人才缺口大，再加上就業形勢又很嚴峻，介于這些，我們想培養一批優秀的網絡安全人才，將對網絡安全行業、黑客技術，以及滲透測試技術感興趣的小白培養成精英。
跟隨我們，不管你有多白，都可以逐步進入網絡安全行業，并最終在這個行業找到高薪職業。
然后呢，我要說一句，關于“黑客”可能并不是大多數人所了解的那樣。關于這些，可以參考：什么是黑客？什么是滲透測試？2分鐘看完這800多字你就懂了
那么，我們就先從代碼基礎——HTML的基本語方開始。
首先給大家描述三個概念：語言、程序、代碼之前的關系。
首先我們就要搞清楚什么是語言？可能說HTML語言不太好理解，那么我們想一想日常生活當中比較常見的我們中國人彼此之間都會交流，是不是叫做漢語呢？所以說漢語就是一門語言。
那么這時候大家腦子里面就可以構思一下啊什么樣的東西大致就是語言了。它應該是一種溝通交流的一種方法的一個集合，包括我們如何發音，如何寫字，這些字如何拼在一起，能夠產生具體的意義，有一定的含義，這些所有所有的集合在一起，形成了一套規則，然后大家都去遵循這套規則，就能夠彼此交流，那么這就叫做語言。
我們再舉一個例子，比如說英國人或者美國人，他們也有自己的語言，叫做英語，那么我在這里就是換了另一種語言，
了解了語言之后，我們就再來看一看，什么是代碼，那代碼跟我們日常生活中的這種能夠聯系起來的又是什么東西呢？
我們還是拿漢語來做比喻哈，我們說漢語就是一種交流溝通的一種規則，它是一門語言。在大家小的時候肯定就會去學這門語言。這門學科在小學的時候就叫語文，對吧。那么我們上語文課的時候，就要學一些最基礎的有關語言的東西，比如說漢語拼音生字詞，當時要記很多的這種生字生詞，那么他是不是可以理解成是我們漢語的一種最基本的那種組成結構？
那么英語呢？我們在學習英語的時候也會去記一些東西啊，就比如英文字母，緊接著就是背各種各樣的單詞，是不是當我們單詞量有了一定的積累之后，我們對這個語言呢就掌握得更深刻了。
那么漢語要背生字詞，英語呢要背單詞，這些最基本的組成結構。那么在程序語言里面，代碼就可以理解成是生字詞或者是單詞。
最后，我們再來看看什么是程序。它是由很多很多一行一行的代碼組成在一起，能夠完成一個綜合性的或者一個比較大的一個目標的這樣的一個代碼的集合。
那么我們對照一下自然的這種語言，比如說漢語英語呢它是什么樣？好多的文字放在一起，是不是句子？或者說再多一點兒就是一篇文章。一篇文章甚至再大一點兒可能是一本書，
那么漢語能寫文章，用英語英文也能寫文章，這個文章可大可小，可能幾千字能大一點兒的一本書，也可以理解成是文章，那么用生字詞組成的這種集合就成了文章了。然后我們再談程序，它是什么呢？對照一下大家可能就理解了，它就是一個由代碼組成的文章。
那么回過頭來我們看我們要學的HTML語言，它也是一門語言，只不過呀它跟我們理解的漢語和英語有一定的區別。
漢語的主流是中國人之間交流的時候溝通的時候用的語言。那么英語呢應用的比較廣泛，是一些英語國家之間彼此交流溝通的時候用的語言。那么HTML語言它也是一種語言，只不過它不是人和人之間去交流的語言，那么它到底是做什么用的呢？我們來看一下HTML的概念。
HTML中文名稱叫做超文本標記語言，用HTML編寫的超文本文檔稱為HTML文檔。它能夠獨立于各種操作系統平臺，使用HTML語言將所需要表達的信息按某種規則寫成HTML文件，通過專用的瀏覽器來識別，并將這些HTML文件翻譯成可以識別的信息，即現在所見到的網頁。
那么從中我們能看到什么呢？首先我們知道它的中文名稱了。HTML叫做超文本標記語言。
那么再往下我們看他提到了。
在這里瀏覽器是吧？提到了瀏覽器，那么這時候我們就知道了HTML語言啊它是一種與瀏覽器之間進行交流的這么一種語言。就是我們去寫一些代碼，那么寫這些代碼的目的是什么呢？目的就是為了和瀏覽器去交流，只要我們寫的這個東西瀏覽器能看得懂，他就會根據我們寫的代碼呈現出最終的網頁。這就是HTML語言的一個基本概念。
（1）HTML中的各種元素都是通過標記（標簽）來表示。
（2）HTML當中的標簽分為單標簽和雙標簽。
（3）單標簽格式為<名稱/>，雙標簽格式為<名稱></名稱>。
（4）HTML對大小寫不敏感。
然后，我們可以對照一下HTML的基本結構
（1）<html></html>
（2）<body></body>
（3）<head></head>
（4）<title></title>
首先，我們打開一個記事本。
單擊窗口圖片，在列表中找到記事本
然后在記事本中輸入<html></html>,這表示告訴瀏覽器，這是一個標準的HTML網頁。
在記事本中輸入<html></html>
那么為什么是兩個呢？前面1個，后面1個，這就有點類似于我們標點符號里邊的括號，前面有一個開始，左半邊括號后面有一個結束。右半邊括號在這里也是前面的HTML表示網頁從這兒開始，那么后邊這個-html表示網頁呢至此結束。
那我們網頁這才剛開始就結束了呢，別著急，我們來看我在這里敲了幾次回車把它分開了。那么表示什么意思呀？表示中間呀是有很多內容的，就是在網頁開始到網頁結束的中間是會有其他的東西的。
分開html開始和結束標簽
我們接著往下看，第二個標簽呢叫做<body></body>,里面的單詞呢表示的是身體，那么它呢表示的就是網頁的主體，這個網頁的主體也屬于基本結構，那么它在哪兒呢？注意啊網頁的主體也屬于網頁，那么它呀要放在<html></html>的中間。
將<body></body>標簽插入到<body></body>中
下面，我們開始將第3個標簽<head></head>寫入記事本，它代表頭部。他表示頭是吧？我們可以想象一下，這個腦袋注意它和身體之間到底應該是個什么樣的關系呢？就我們想象有一個人站在那兒，腦袋應該是在上面，身子應該是在下邊哈。所以注意我們這個<head>標簽呀要放在<body></body>標簽的上方。注意！它們之間沒有包含關系！是一上一下的。
在<body></body>標簽的上方插入<head></head>
最后一個叫做<title></title>這個單詞的意思呢叫做標題。那么這個標題你應該放在哪？告訴大家，它屬于網頁的頭部，在頭部的里邊。
好了，整理一下格式
插入<title></title>標簽
我們來看4個基本結構的組成標簽，我們都已經寫到了這個文檔里面了。
大家需要注意的是，我寫的這種結構啊這個包含的關系非常重要。最外邊是html表示網頁開始，到網頁結束，中間呢有頭、身子，還有標題，那么頭和身子是一上一下的關系，那么標題呢屬于頭部里邊兒。要記住這個格式！
那么到現在為止呀我們這個網頁的基本結構就算是真正寫完了，我們把它保存一下。現在這個文檔里邊啊我們寫的是網頁的程序，雖然很簡單，但它也是一個完整的網頁了。
那么既然是一個網頁，那我們如何能打開它看這個網頁呢？注意這個HTML寫出來的這個程序啊需要放在HTML文件里邊，
那么我們怎么做呢？直接把這個記事本改后綴，他現在是個.txt文檔，我們把這個文件的后面的txt擴展名改成html。
將.txt格式改成.html格式
雙擊“網頁.html”，就會打開一個網頁。
用代碼創建的第1個初始網頁
果然是用瀏覽器打開的一個網頁，但是里邊呢還沒有東西是吧？空白的。
那么我們就來看一下，重新用記事本的方式把它打開。
我現在要想在里邊簡單的寫點文字，哎我看看我這個網頁是否能夠正常顯示。
那么在哪兒能夠寫文字呢？跟大家說一下，
在我們這個基本結構里啊有兩個地方是可以寫內容的，一個就是<body></body>主體，另外一個呢就是<title></title>標題，這兩個地方中是可以寫文字內容的。
右鍵單擊這個html文件，選擇打開方式→打開其他應用，然后找到記事本，用記事本打開。
用記事本打開html文件
然后在<title></title>中間寫上“我的第一個網頁”，<body></body>中間寫上“這里是主體文字”
標簽中間插入文字，讓網頁中有內容
好了，寫完之后我們再保存。關閉這個窗口，重新打開看一下效果。那么大家看這會兒在網頁里面顯示出來了。首先呢在網頁主體里邊顯示出了“這里是主體文字”，并且在頁面的上方的標簽呢顯示的是“我的一個網頁”。
用代碼創建的第1個網頁
那么我們今天的講解你看懂了么？
帶你學代碼、學編程、學語言、學網絡安全、學黑客技術、學滲透技術，逐步成為網絡高手，拿到年薪30W+的offer，在網絡江湖，從小刀客變成大俠。如果感興趣，請關注我，私信我，可獲得更多學習資料。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
