溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
1.基本結構：
<html> //文件開始標志，表示網頁文檔的開始
<head> //文件頭，標題，主題
............ //文件頭內容
<meta charset="utf-8"> //網頁的編碼
</head> //文件頭結束標記
<body> //文件主體開始標志
............. //文件主體內容
</body> //文件主體結束
</html> //文件結束標志
<!-- --> //注釋
2.HTML標題標簽
（1）<h2>,<h3>,<h4>,<h5>,<h6>,<h7>
<body>
<h2>個人主頁</h2> //字體由大到小，帶有間距
<h3>登錄</h3>
<h4>登錄</h4>
<h5>登錄</h5>
<h6>登錄</h6>
<h7>登錄</h7>
</body>
（2）<p></p>
<body>
<h2>html基本結構</h2>
<p>
???????超文本標記語言，標準通用標記語言下的一個應用。
<br />“超文本”就是指頁面內可以包含圖片、鏈接，甚至音樂、程序等非文字元素。
<br />超文本標記語言的結構包括“頭”部分（英語：Head）、和“主體”部分（英語：Body），其中“頭”部提供關于網頁的信息，“主體”部分提供網頁的具體內容。
// <br />：換行
</p>
<p>10>5</p> //大于小于，段落間有間距
<p>10 > 5</p>
<p>10<5</p></body>
<p>標簽定義一個文本段落，一個段落含有默認的上下間距，段落之間會用這種默認間距隔開
3.語義標簽
（1）<div>標簽 塊元素，表示一塊內容，沒有具體的語義。
<div>
???????超文本標記語言，標準通用標記語言下的一個應用。
<br />“超文本”就是指頁面內可以包含圖片、鏈接，甚至音樂、程序等非文字元素。
<br />超文本標記語言的結構包括“頭”部分（英語：Head）、和“主體”部分（英語：Body），其中“頭”部提供關于網頁的信息，“主體”部分提供網頁的具體內容
</div>
<div>
<div>
<h2>div標簽</h2>
</div>
<div>超文本標記語言</div>
</div>
//<div>表示塊，塊與塊之間沒有間距，可以嵌套，而<p>不可以嵌套，（2）<span>標簽 行內元素，表示一行的一小段內容，沒有具體的語義。
4.圖片標簽
<p>
???????<span>超文本標記語言，標準通用標記語言下的一個應用。</span>
// <span> ：能在<p>里的某一段設置一個樣式，本身不帶有樣式
</p>（3）含樣式和語義的標簽
<em>標簽行內元素，表示語氣中的強調詞，斜體
<i> 行內元素，表示專業詞匯，斜體
<b>行內元素，表示加粗，關鍵詞
<strong>行內元素，表示非常重要的內容，整體加粗
<p>
???????<span><b>超文本標記語言，標準通用標記語言下的一個應用。</b></span>
<br /><strong>“超文本”就是指頁面內可以包含圖片、鏈接，甚至音樂、程序等非文字元素。
<br />超文本標記語言的結構包括“頭”部分（英語：<em>Head</em>）、和“主體”部分（英語：<i>Body</i>），其中“頭”部提供關于網頁的信息，“主體”部分提供網頁的具體內容</strong>
</p>
**（4）語義化的標簽**
就是布局的時候多使用有語義的標簽，搜索引擎在爬網的時候能認識這些標簽，如：h2表示標題，p表示段落，ul,li表示列表，a表示鏈接，dl,dt,dd表示定義列表（5）圖片標簽
src屬性定義圖片的引用地址
alt屬性定義圖片加載失敗時顯示的文字，搜索引擎會使用這個文字收錄圖片、盲人讀屏軟件會使用
<img src="image/路飛1.jpg" alt="我要成為海賊王的男人" />
<img src="image/biu.gif" alt="鄧紫棋.gif" />
<img src="C:\Users\雄少\Pictures\ps\新建文件夾\like.gif" alt="比個like你" />
//相對路徑： ./表示當前目錄，可以省略 ../表示上一級目錄
//絕對路徑：最好用相對路徑，在別的地方也可以用
5.HTML鏈接標簽
（1）<a>標簽可以在網頁上定義一個鏈接地址，它的常用屬性有
href屬性 定義跳轉的地址
title屬性 定義鼠標懸停時彈出的提示文字框
target屬性 定義鏈接窗口打開的位置，target=“_self"缺省值，新頁面替換原來的頁面，在原來位置打開，target="_blank"新頁面會在新開的一個瀏覽器窗口打開
<img src="image/路飛1.jpg" alt="我要成為海賊王的男人" />
<img src="image/biu.gif" alt="鄧紫棋.gif" />
<img src="C:\Users\雄少\Pictures\ps\新建文件夾\like.gif" alt="比個like你" />
<a href="link.html" target="_self">主頁</a> -
<a title="鼠繪網站" target="_blank">
<img src="image/海賊王.jpg" alt="海賊王logo">
</a>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<a href="#">回到頂部</a>
**6.HTML列表**（1）有序列表：<ol>
<li></li>
</ol>
//快捷寫法：ol>li*3
（2）無序列表：<ul>
<li></li>
</ul>
//快捷寫法：ul>(li>a)*3
<h2>有序列表</h2>
<ol>
<li>html</li>
<li>css</li>
<li>javascript</li>
</ol>
<ul>
<li><a target="_blank">騰訊NBA</a></li>
<li><a target="_blank">騰訊視頻</a></li>
<li><a target="_blank">豆瓣電影</a></li>
</ul>（3）定義列表：通常用于術語的定義。<dl>表示列表的整體，<dt>表示術語的題目，<dd>表示術語的解釋，一個dl可以有多高題目和解釋
<dl>
<dt>html</dt>
<dd>負責頁面結構</dd> //首行縮進
<dt>css</dt>
<dd>負責頁面表現</dd>
<dt>javascript</dt>
<dd>負責頁面行為</dd>
</dl>
*//簡寫：dl>(dt+dd)3**
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
