免費(fèi)AI編程助手
一、 HTML的基本結(jié)構(gòu)
<head>
<title>網(wǎng)頁(yè)的標(biāo)題</title>
<meta charset="utf-8"/>
</head>
<body>
寫網(wǎng)頁(yè)的主體
</body>
注意：寫完代碼記得將格式保存為 .html（推薦） htm xhtml HTML 的基本結(jié)構(gòu)詳解
1.<html>內(nèi)容</html> 解釋：HTML 文檔的文檔標(biāo)記，也稱為 HTML 開始標(biāo)記 功能：表示網(wǎng)頁(yè)的開始和結(jié)束
2.<head>內(nèi)容</head> 解釋：HTML 文件頭標(biāo)記，也稱為 HTML 頭信息開始標(biāo)記 功能：用來包含文件的基本信息，比如網(wǎng)頁(yè)的標(biāo)題、關(guān)鍵字，在內(nèi)可以放、、等等標(biāo)記 注意：當(dāng)中的內(nèi)容不會(huì)在瀏覽器當(dāng)中顯示
3.<title>內(nèi)容</title> 解釋：HTML 的標(biāo)題文件 功能：網(wǎng)頁(yè)的主題，顯示在瀏覽器的窗口的左上邊！
4.<body>內(nèi)容</body>
解釋：HTML 文檔的主體標(biāo)記 功能：…是網(wǎng)頁(yè)的主體部分，在此標(biāo)記之間可以包含如<p></p>、<h1></h1>、<br>、<hr>等等標(biāo)記，正是由這些內(nèi)容組成了我們所看見的網(wǎng)頁(yè)
二、HTML的基本標(biāo)簽
1、格式標(biāo)簽：
- 段落標(biāo)簽：格式：<p>你要分段的內(nèi)容</p> 功能：對(duì)網(wǎng)頁(yè)上的文字進(jìn)行分段特點(diǎn)：間距比較大
- 換行標(biāo)簽格式：你要換行的文字后面直接加標(biāo)簽：<br/>注意：它是一個(gè)單標(biāo)簽
- 居中對(duì)齊標(biāo)簽格式：<center>你要居中的內(nèi)容</center>讓段落或者文字能夠相對(duì)于父標(biāo)簽居中顯示
2、文本標(biāo)簽
- 標(biāo)題標(biāo)簽：格式：<h1>標(biāo)題</h1>...<h6>標(biāo)題</h6> 功能：定義網(wǎng)頁(yè)中的文字標(biāo)題特點(diǎn)： 標(biāo)題標(biāo)簽獨(dú)占一行
- 字體設(shè)置標(biāo)簽：格式：<font>要設(shè)置的文字</font> 功能：修改文字顏色、字體、大小。常用屬性：
<font szie="12px">老王</font>
<font color ="red">字體改為紅色</font>
<font face="微軟雅黑">更改文字字體</font>
- 字體加粗/傾斜表示強(qiáng)調(diào)，通常為粗體字
</strong>
<b>字體加粗</b>
- <em>表示強(qiáng)調(diào)
3、圖像標(biāo)簽
網(wǎng)頁(yè)上面我們看到不僅有文字、還有圖片,下面重點(diǎn)講如何向網(wǎng)當(dāng)中插入圖片！
格式如下：<img src="圖片路徑" width="設(shè)置圖片寬度" height="設(shè)置圖片高度" border="邊框" alt="圖片"/>
<img/>標(biāo)簽常見屬性詳解
- src 屬性作用：指定我們要加載的圖片的路徑和圖片的名稱以及圖片格式
- width 屬性作用：指定圖片的寬度，單位 px、em、cm、mm
- height 屬性作用：指定圖片的高度，單位 px、em、cm、mm
- border 屬性作用：指定圖標(biāo)的邊框?qū)挾?，單?px、em、cm、mm
- alt 屬性作用：
當(dāng)網(wǎng)頁(yè)上的圖片被加載完成后，鼠標(biāo)移動(dòng)到上面去，會(huì)顯示這個(gè)圖片指定的屬性文字作用
如果圖像沒有下載或者加載失敗，會(huì)用文字來代替圖像顯示作用
搜索引擎可以通過這個(gè)屬性的文字來抓取圖片
三、網(wǎng)頁(yè)中的超鏈接
基本語(yǔ)法<a href="" target="打開方式" name="頁(yè)面錨點(diǎn)名稱" >鏈接文字或者圖片</a>屬性講解- href 屬性：鏈接的地址，鏈接的地址可以是一個(gè)網(wǎng)頁(yè)，也可以是一個(gè)視頻、圖片、音樂等等
- target 屬性：
1、作用：定義超鏈接的打開方式
2、屬性值：_blank：在一個(gè)新的窗口中打開鏈接
_seif(默認(rèn)值)：在當(dāng)前窗口中打開鏈接
_parent：在父窗口中打開頁(yè)面（框架中使用較多）
_top：在頂層窗口中打開文件（框架中使用較多）
name 屬性指定頁(yè)面的錨點(diǎn)名稱
注：代碼的格式空格鍵和回車鍵在網(wǎng)頁(yè)中都不會(huì)起到任何作用，我們?yōu)榱俗尨a清晰易讀，可以使用空格和回車鍵進(jìn)行編排。
