整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
態網頁的擴展名：.htmlt .htm
動態網頁的擴展名：.ASP、.JSP .aspx .php(含 有php代碼和Mysql代碼）等
瀏覽器不能直接識別php和MySQL的代碼，只能由服務器端的服務器軟件Apache來進行解釋成HTML代碼返回給瀏覽器。
一個網頁中基本上有三種代碼：HTML代碼\CSS代碼和php代碼,這種說法是不是太落后了?
1.HTML的概念:
HTML,全稱Hypertext Markup Language,超文本標注語言,是一個標準,或說是一套標記.
比如:文本加粗標記 <b>我愛學習</b>
一級標題 <h1> </h1>
<html></html>是網頁中最大的標記,告訴瀏覽器如何翻譯這個文件 的內容,包括head和body兩部分.
head中的內容不可見,一般用于特殊功能
<meta>是head的子標記,告訴瀏覽器,這個網頁用什么字符編碼來顯示,比如：gb2312(簡體中文)、utf-8(多國語言).如果這地方設置不合理,網頁會出現亂碼.
Body是可見內容,是呈現給使用者的網頁內容.
簡單實例結構
<html>
<head>頭
<title>網頁標題</title>只能填寫純文本
</head>
<body>文件主體,99%內容在這里
<h1>一級標題</h1>
<body>
</html>
文本標記語言 (英語：Hypertext Markup Language，簡稱：HTML ) 是一種用來結構化 Web 網頁及其內容的標記語言。網頁內容可以是：一組段落、一個重點信息列表、也可以含有圖片和數據表。正如標題所示，本文將對 HTML 及其功能做一個基本介紹。
HTML 不是一門編程語言，而是一種用于定義內容結構的標記語言。HTML 由一系列的元素（elements）組成，這些元素可以用來包圍不同部分的內容，使其以某種方式呈現或者工作。 一對標簽（ tags）可以為一段文字或者一張圖片添加超鏈接，將文字設置為斜體，改變字號，等等。 例如，鍵入下面一行內容：
學前端，關注艾編程可以將這行文字封裝成一個段落（paragraph）元素來使其在單獨一行呈現：
<p>學前端，關注艾編程</p>讓我們深入探索一下這個段落元素。
這個元素的主要部分有：
屬性應該包含：
注：不包含 ASCII 空格（以及 " ' ``=<>` ）的簡單屬性值可以不使用引號，但是建議將所有屬性值用引號括起來，這樣的代碼一致性更佳，更易于閱讀。
也可以將一個元素置于其他元素之中 —— 稱作嵌套。要表明貓咪非常暴躁，可以將 “艾編程” 用 <strong> 元素包圍，爆字將突出顯示：
<p>學編程，關注<strong>艾編程</strong>:)</p>必須保證元素嵌套次序正確：本例首先使用 <p>標簽，然后是<strong>標簽，因此要先結束<strong>標簽，最后再結束</p>標簽。以下這個示例就是一個錯誤的示范，這樣是不對的：
<p>學編程，關注<strong>艾編程</p></strong>元素必須正確地開始和結束，才能清楚地顯示出正確的嵌套層次。否則瀏覽器就得自己猜測，雖然它會竭盡全力，但很大程度不會給你期望的結果。所以一定要避免！
不包含任何內容的元素稱為空元素。比如 `` 元素：
<img src="images/icodingedulgo.png" alt="艾編程logo">本元素包含兩個屬性，但是并沒有 </img> 結束標簽，元素里也沒有內容。這是因為圖像元素不需要通過內容來產生效果，它的作用是向其所在的位置嵌入一個圖像。
以上介紹了一些基本的 HTML 元素，但孤木不成林?，F在來看看單個元素如何彼此協同構成一個完整的 HTML 頁面?；仡?文件處理 小節中創建的 index.html 示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>入門學前端的博客，艾編程博客</title>
</head>
<body>
<img src="images/icodingedulgo.png" alt="艾編程logo">
</body>
</html>這里有：
重溫一下 `` 元素：
<img src="images/icodingedulogo.png" alt="艾編程logo">像之前所講，該元素通過包含圖像文件路徑的地址屬性 src，可在所在位置嵌入圖像。
該元素還包括一個替換文字屬性 alt，是圖像的描述內容，用于當圖像不能被用戶看見時顯示，不可見的原因可能是：
1、用戶有視覺障礙。視障用戶可以使用屏幕閱讀器來朗讀 alt 屬性的內容。
2、有些錯誤使圖像無法顯示?？梢栽囍室鈱?src 屬性里的路徑改錯。保存并刷新頁面就可以在圖像位置看到：
alt 屬性的關鍵字即“描述文本”。alt 文本應向用戶完整地傳遞圖像要表達的意思。用 "測試圖片" 來描述 Firefox 標志并不合適，修改成 "Firefox 標志：一只盤旋在地球上的火狐" 就好多了。
可以試著為圖像編寫一些更好的 alt 文本。
本段包含了一些最常用的文本標記 HTML 元素。
標題元素可用于指定內容的標題和子標題。就像一本書的書名、每章的大標題、小標題，等。HTML 文檔也是一樣。HTML 包括六個級別的標題， <H1> (en-US)–<h6> (en-US) ，一般最多用到 3-4 級標題。
<h1>主標題</h1>
<h2>頂層標題</h2>
<h3>子標題</h3>
<h4>次子標題</h4>可以嘗試在 `` 元素上面添加一個合適的標題。
注：可以發現 MDN 網站上 第一級標題的主題是隱藏的。不要使用標題元素來加大、加粗字體，因為標題對于 無障礙訪問 和 搜索引擎優化 等問題非常有意義。要保持頁面結構清晰，標題整潔，不要發生標題級別跳躍。
如上文所講，<P> 元素是用來指定段落的。通常用于指定常規的文本內容：
<p>這是一個段落</p>試著添加一些文本（在 設計網站的外觀 小節）到一個或幾個段落中，并把它們放在你的 `` 元素下方。
Web 上的許多內容都是列表，HTML 有一些特別的列表元素。標記列表通常包括至少兩個元素。最常用的列表類型為：
1、無序列表（Unordered List）中項目的順序并不重要，就像購物列表。用一個 <ul> 元素包圍。
2、有序列表（Ordered List）中項目的順序很重要，就像烹調指南。用一個 <ol> 元素包圍。
列表的每個項目用一個列表項目（List Item）元素 <li> 包圍。
比如，要將下面的段落片段改成一個列表：
<p>艾編程是一個綜合性的web前端編程學習網站，
包含了html、css、JavaScript等系列知識……</p>可以這樣更改標記：
<p>Mozilla 艾編程是一個綜合性的web前端編程學習網站。包含了</p>
<ul>
<li>html</li>
<li>css</li>
<li>JavaScript</li>
</ul>
<p>等系列知識……</p>試著在示例頁面中添加一個有序列表和無序列表。
鏈接非常重要 — 它們賦予 Web 網絡屬性。要植入一個鏈接，我們需要使用一個簡單的元素 — <a> — a 是 "anchor" （錨）的縮寫。要將一些文本添加到鏈接中，只需如下幾步：
如果網址開始部分省略了 https:// 或者 http://，可能會得到錯誤的結果。在完成一個鏈接后，可以試著點擊它來確保指向正確。
href 這個名字可能開始看起來有點令人費解，代表超文本引用（ hypertext reference）。
現在就為頁面添加一個鏈接吧。
如果你一直跟著這篇文章里的指導做的話，你應該完成了一個像下面這樣的頁面：
代碼部分：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>艾編程前端</title>
</head>
<body>
<h1>艾編程前端示例頁面</h1>
<img src="https://www.icodingedu.com/files/system/2019/09-25/22132557f330499313.png" alt="艾編程logo整體以盾型為外輪廓設計，以代碼符號””為基礎圖形進行抽象畫變形，中間的“/”符號用首字母“i”替代，同時也是諧音“愛”，象征著美好">
<p>艾編程是一個綜合性的web前端編程學習網站。包含了</p>
<ul>
<li>html</li>
<li>css</li>
<li>JavaScript </li>
</ul>
<p>等系列知識……</p>
<p>為了讓您更好的學好前端編程，請參閱 <a href="https://www.icodingedu.com/">艾編程</a></p>
</body>
</html>你學到了嗎？如果有幫助記得關注收藏點贊哦！
天我們來學習HTML基本格式。
H1 標簽定義了一個文檔的標題 ，雖然在瀏覽器里顯示了預期的效果 ，但它并不是一個符合規范的 html 文檔，今天我們就來定義一個標準的 html 文檔。
這是一個 html 文檔的基本格式 ，來深入的剖析一下
<!DOCTYPE html> 這個標簽會告訴瀏覽器，后面書寫的是HTML5規范 的語法，瀏覽器會按照 HTML5 的語法規范進行解析
<html lang='en'> 包裹了整個頁面的所有內容，有時被稱為根元素。
<head> 是所有頭部元素的容器，描述了文檔的各種屬性和信息，比如文檔的標題，文檔引用的樣式表和JS腳本文件，頁面元信息等等，絕大多數文檔頭部包含的數據，都不會真正作為內容顯示給瀏覽者。
<meta charset="utf-8"> 將文檔應該使用的字符集設置為UTF-8，它包括了書面語言的大多數字符，基本上可以處理放在頁面上的任何文本內容，它可以幫助你解決頁面亂碼的問題。
<title> 設置頁面的標題，也就是出現在瀏覽器標簽中的內容，它描述頁面被加入入書簽或收藏時的標題
<body> 它包含了頁面展示的所有內容，比如文字，圖片，視頻，游戲，可播放的音樂等等
一般情況下 一個符合規范的 html 文檔 都應該使用這個基本格式
回到編輯器 我們創建一個文件 名字叫 base.html 我們快速的編寫好 html 基本格式， 在 <body> 標簽里寫一個 h1 在里面寫一些內容，瀏覽器中打開頁面正常的顯示了，每個頁面都寫這么多東西很麻煩 我們有 vscode。
刪除所有內容 在頁面里只需一個感嘆號 ，再按一下 tab 鍵 ，html 基本格式自動生成了，這時就可以直接在 body 內編寫網頁內容了。
通過觀察基本結構發現 標簽前面有的有空格 有的沒有空格 這是為什么呢 實際上 當出現標簽嵌套的時候 需要保持一個固定的縮進 ，一般采用兩個或者四個空格 具體看個人習慣和開發團隊的規范，為了方便閱讀不推薦混用 。 有些標簽嵌套在一起，這就是標簽結構嵌套
在一個標簽內再次書寫一個標簽 他們之間形成了這樣的包裹關系 ，別包裹的叫做子標簽，包裹的就是父標簽。
在父子標簽嵌套的時候子標簽整體相對于父標簽多一套縮進，更加方便閱讀。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
