整合營銷服務(wù)商
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數(shù)據(jù)同步管理
免費咨詢熱線：
1.用兩個空格來代替制表符（tab） -- 這是唯一能保證在所有環(huán)境下獲得一致展現(xiàn)的方法。
2.嵌套元素應(yīng)當縮進一次（即兩個空格）。
3.對于屬性的定義，確保全部使用雙引號，絕不要使用單引號。
4.不要在自閉合（self-closing）元素的尾部添加斜線
5.不要省略可選的結(jié)束標簽（closing tag）（例如，</li> 或</body>）。
6.為每個 HTML 頁面的第一行添加標準模式（standard mode）的聲明，這樣能夠確保在每個瀏覽器中擁有一致的展現(xiàn)。<!DOCTYPE html>
7.語言屬性
根據(jù) HTML5 規(guī)范：
強烈建議為 html 根元素指定 lang 屬性，從而為文檔設(shè)置正確的語言。這將有助于語音合成工具確定其所應(yīng)該采用的發(fā)音，有助于翻譯工具確定其翻譯時所應(yīng)遵守的規(guī)則等等.
<html>
<!-- ... -->
</html>
8.IE 兼容模式
IE 支持通過特定的 <meta> 標簽來確定繪制當前頁面所應(yīng)該采用的 IE 版本。除非有強烈的特殊需求，否則最好是設(shè)置為 edge mode，從而通知 IE 采用其所支持的最新的模式。
<metahttp-equiv="X-UA-Compatible"content="IE=Edge">
9.字符編碼
通過明確聲明字符編碼，能夠確保瀏覽器快速并容易的判斷頁面內(nèi)容的渲染方式。這樣做的好處是，可以避免在 HTML 中使用字符實體標記（character entity），從而全部與文檔編碼一致（一般采用 UTF-8 編碼）。
<head>
<meta charset="UTF-8">
</head>
10.引入 CSS 和 JavaScript 文件
根據(jù) HTML5 規(guī)范，在引入 CSS 和 JavaScript 文件時一般不需要指定 type 屬性，因為 text/css 和 text/javascript 分別是它們的默認值。
<!-- External CSS -->
<link rel="stylesheet" href="code-guide.css">
<!-- In-document CSS -->
<style>
/* ... */
</style>
<!-- JavaScript -->
<script src="code-guide.js"></script>
11.
布爾（boolean）型屬性
布爾型屬性可以在聲明時不賦值。XHTML 規(guī)范要求為其賦值，但是 HTML5 規(guī)范不需要。
<input type="checkbox" value="1" checked>
12.
減少標簽的數(shù)量
編寫 HTML 代碼時，盡量避免多余的父元素。很多時候，這需要迭代和重構(gòu)來實現(xiàn)。請看下面的案例：
<!-- Not so great -->
<span>
<img src="...">
</span>
<!-- Better -->
<img src="...">
13.
不要使用 @import
與 <link> 標簽相比，@import 指令要慢很多，不光增加了額外的請求次數(shù)，還會導致不可預料的問題。替代辦法有以下幾種：
使用多個 <link> 元素
通過 Sass 或 Less 類似的 CSS 預處理器將多個 CSS 文件編譯為一個文件
通過 Rails、Jekyll 或其他系統(tǒng)中提供過 CSS 文件合并功能
14.
class 命名
class 名稱中只能出現(xiàn)小寫字符和破折號（dashe）（不是下劃線，也不是駝峰命名法）。破折號應(yīng)當用于相關(guān) class 的命名（類似于命名空間）（例如，.btn 和 .btn-danger）。
避免過度任意的簡寫。.btn 代表 button，但是 .s 不能表達任何意思。
class 名稱應(yīng)當盡可能短，并且意義明確。
使用有意義的名稱。使用有組織的或目的明確的名稱，不要使用表現(xiàn)形式（presentational）的名稱。
基于最近的父 class 或基本（base） class 作為新 class 的前綴。
使用 .js-* class 來標識行為（與樣式相對），并且不要將這些 class 包含到 CSS 文件中。
.t { ... }
.red { ... }
.header { ... }
/* Good example */
.tweet { ... }
.important { ... }
.tweet-header { ... }
全棧攻城獅-每日更新原創(chuàng)IT編程技術(shù)及日常實用視頻。
主要內(nèi)容：正式引入HTML網(wǎng)頁開發(fā)，學習并了解HTML的相關(guān)知識。變身Web開發(fā)達人，做全棧程序員。這是HTML技術(shù)的第二課，主要講解一下開發(fā)工具及HTML的結(jié)構(gòu)，做出來屬于我們的第一個Web網(wǎng)頁。
作為程序員，只要做電腦編程寫代碼，一定會選擇一款合適的開發(fā)工具。HTML的書寫的話，開發(fā)工具就有的選擇了。
程序員寫代碼
作為HTML的開發(fā)，其實使用記事本完全就可以了，因為HTML網(wǎng)頁本身就是文本文件。但是沒人會使用記事本進行開發(fā)，因為一款適合自己的開發(fā)工具可以大大的提高寫代碼的效率。
下面我列出來幾個比較常用的HTML開發(fā)工具：
NotePad++、EditPlus、Adobe Dreameaver、Sublime、WebStorm、Visual Studio等。
我們這階段課程，主要使用Sublime這款工具為例進行使用，當然其他的開發(fā)工具也是大同小異。
Sublime代碼編輯器
直接打開微軟的必應(yīng)搜索，這里不得不吐下槽，國內(nèi)的搜索引擎真的不敢恭維。搜索結(jié)果顯示并不是很好。谷歌當然是最不錯的選擇。但是無奈谷歌上不去，所以可以推薦給你使用必應(yīng)搜索。必應(yīng)搜索的結(jié)果可以說幾乎和谷歌相差不大。
必應(yīng)搜索
直接打開必應(yīng)搜索，輸入“sublime text 3”進行搜索，你就能找到官方網(wǎng)址。打開進行下載即可：
Sublime的下載方式
打開Sublime的官網(wǎng)，選擇Download，選擇合適你電腦系統(tǒng)的版本進行安裝：
下載Sublime
打開Sublime，默認打開：
軟件默認界面
此時，會默認打開一個新文件，首先點擊鍵盤上的Ctrl+S。進行文件保存。選擇合適的路徑，并輸入文件名，后綴以html。
保存html
添加代碼HTML的結(jié)構(gòu)：
需要明確的是HTML有一個文檔結(jié)構(gòu)的。就好比人有頭部和身體組成。html也是如此。上面就是html最簡單的結(jié)構(gòu)。
<html>類型標簽，表示開始標簽。</html>類型的表示結(jié)束標簽。
兩個標簽之間的內(nèi)容，輸入整個html標簽。
我們習慣性的把<xxxx>...</xxxx>的格式的代碼，叫做xxxx標簽。
為結(jié)構(gòu)添加內(nèi)容，做我們第一個Web網(wǎng)頁：
第一個Web網(wǎng)頁
此時，找到html文件所在路徑，雙擊打開，運行你就會看到效果：
網(wǎng)站結(jié)構(gòu)
經(jīng)過運行結(jié)果，你就會明白title、body標簽所展現(xiàn)的樣子了。
本視頻由做全棧攻城獅，原創(chuàng)首發(fā)，如有轉(zhuǎn)載，請注明出處。
如果你有什么比較不錯的編程技巧，或者你想要什么程序員編程資源，點擊下方了解更多。
天我們來學習HTML基本格式。
H1 標簽定義了一個文檔的標題 ，雖然在瀏覽器里顯示了預期的效果 ，但它并不是一個符合規(guī)范的 html 文檔，今天我們就來定義一個標準的 html 文檔。
這是一個 html 文檔的基本格式 ，來深入的剖析一下
<!DOCTYPE html> 這個標簽會告訴瀏覽器，后面書寫的是HTML5規(guī)范 的語法，瀏覽器會按照 HTML5 的語法規(guī)范進行解析
<html lang='en'> 包裹了整個頁面的所有內(nèi)容，有時被稱為根元素。
<head> 是所有頭部元素的容器，描述了文檔的各種屬性和信息，比如文檔的標題，文檔引用的樣式表和JS腳本文件，頁面元信息等等，絕大多數(shù)文檔頭部包含的數(shù)據(jù)，都不會真正作為內(nèi)容顯示給瀏覽者。
<meta charset="utf-8"> 將文檔應(yīng)該使用的字符集設(shè)置為UTF-8，它包括了書面語言的大多數(shù)字符，基本上可以處理放在頁面上的任何文本內(nèi)容，它可以幫助你解決頁面亂碼的問題。
<title> 設(shè)置頁面的標題，也就是出現(xiàn)在瀏覽器標簽中的內(nèi)容，它描述頁面被加入入書簽或收藏時的標題
<body> 它包含了頁面展示的所有內(nèi)容，比如文字，圖片，視頻，游戲，可播放的音樂等等
一般情況下 一個符合規(guī)范的 html 文檔 都應(yīng)該使用這個基本格式
回到編輯器 我們創(chuàng)建一個文件 名字叫 base.html 我們快速的編寫好 html 基本格式， 在 <body> 標簽里寫一個 h1 在里面寫一些內(nèi)容，瀏覽器中打開頁面正常的顯示了，每個頁面都寫這么多東西很麻煩 我們有 vscode。
刪除所有內(nèi)容 在頁面里只需一個感嘆號 ，再按一下 tab 鍵 ，html 基本格式自動生成了，這時就可以直接在 body 內(nèi)編寫網(wǎng)頁內(nèi)容了。
通過觀察基本結(jié)構(gòu)發(fā)現(xiàn) 標簽前面有的有空格 有的沒有空格 這是為什么呢 實際上 當出現(xiàn)標簽嵌套的時候 需要保持一個固定的縮進 ，一般采用兩個或者四個空格 具體看個人習慣和開發(fā)團隊的規(guī)范，為了方便閱讀不推薦混用 。 有些標簽嵌套在一起，這就是標簽結(jié)構(gòu)嵌套
在一個標簽內(nèi)再次書寫一個標簽 他們之間形成了這樣的包裹關(guān)系 ，別包裹的叫做子標簽，包裹的就是父標簽。
在父子標簽嵌套的時候子標簽整體相對于父標簽多一套縮進，更加方便閱讀。
*請認真填寫需求信息，我們會在24小時內(nèi)與您取得聯(lián)系。
