時間：2023-07-25 21:18:02 | 來源：網(wǎng)站運營
時間：2023-07-25 21:18:02 來源：網(wǎng)站運營
前端三劍客：第2章（HTML）：
在線咨詢
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body></body></html>1、<!DOCTYPE html>告訴瀏覽器使用什么樣的html或者xhtml來解析html文檔
2、<html></html>是文檔的開始標(biāo)記和結(jié)束標(biāo)記。此元素告訴瀏覽器其自身是一個HTML文檔，在它們之間是文檔的頭部<head>和主體<body>。
3、元素出現(xiàn)在文檔的開頭部分。與之間的內(nèi)容不會在瀏覽器的文檔窗口顯示，但是其間的元素有特殊重要的意義。
4、<title></title>定義網(wǎng)頁標(biāo)題，在瀏覽器標(biāo)題欄顯示。
5、<body></body>之間的文本是可見的網(wǎng)頁主體內(nèi)容
6、<meta charset="UTF-8">聲明編碼方式用utf8
<標(biāo)簽名 屬性1=“屬性值1” 屬性2=“屬性值2”……>內(nèi)容部分</標(biāo)簽名><標(biāo)簽名 屬性1=“屬性值1” 屬性2=“屬性值2”…… />1、HTML標(biāo)簽是由尖括號包圍的特定關(guān)鍵詞在很早以前HTML4的時候，HTML的標(biāo)簽是大寫的，但在后面的發(fā)展中，人們發(fā)現(xiàn)HTML仍然存在很多不足，標(biāo)簽不區(qū)分大小寫和標(biāo)簽可以胡亂嵌套都在其中，于是1998 年語法更為完的XML（ The Extensible Markup Lanxguage 可擴展標(biāo)記語言 ）成為推薦標(biāo)準，意在替代HTML。和HTML一樣，XML同樣來源于SGML，但當(dāng)時已有成千上萬的站點，因此直接使用XML作為網(wǎng)頁開發(fā)技術(shù)根本就不可能。因此，后面W3C就在HTML4.0的基礎(chǔ)上，參照XML的語法規(guī)則對HTML進行擴展，形成了XHTML （ The Extensible HyperText Markup Language ，可擴展超文本標(biāo)記語言 ）的1.0版本。
2、標(biāo)簽分為閉合和自閉合兩種標(biāo)簽
3、HTML不區(qū)分大小寫
4、標(biāo)簽可以有若干個屬性,也可以不帶屬性,比如就不帶任何屬性
5、標(biāo)簽可以嵌套,但是不可以交叉嵌套
<h1>標(biāo)題1</h1><h2>標(biāo)題2</h2><h3>標(biāo)題3</h3><h4>標(biāo)題4</h4><h5>標(biāo)題5</h5><h6>標(biāo)題6</h6><p>大家好，我是段落1。</p><p>大家好，我是段落2。</p><p>大家好，我是段落3。</p><p>大家好，我是段落標(biāo)簽p。我按了enter一下?lián)Q行了</p><p>大家好，我是段落標(biāo)簽p。我按了enter一下<br/> 換行了</p><b>定義粗體文本</b><br /><strong>定義粗體文本方式2</strong><br /><em>定義斜體字</em><br /><i>定義斜體字方式2</i><br /><del>定義刪除文本</del><br />® ©標(biāo)簽大致可分為兩類
<div>只是一個塊級元素，并無實際的意義。主要通過CSS樣式為其賦予不同的表現(xiàn).<span>表示了內(nèi)聯(lián)行(行內(nèi)元素),并無實際的意義,主要通過CSS樣式為其賦予不同的表現(xiàn)塊級元素與行內(nèi)元素的區(qū)別所謂塊元素，是以另起一行開始渲染的元素，行內(nèi)元素則不需另起一行。如果單獨在網(wǎng)頁中插入這兩個元素，不會對頁面產(chǎn)生任何的影響。這兩個元素是專門為定義CSS樣式而生的。1、href是超鏈接最重要的屬性，規(guī)定了用戶點擊鏈接以后的跳轉(zhuǎn)目標(biāo)，這個目標(biāo)可以是 網(wǎng)絡(luò)連接，也可以是本地連接。
2、網(wǎng)絡(luò)鏈接指的是依靠網(wǎng)絡(luò)來進行關(guān)聯(lián)的地址，一般在地址前面是以 http://或者https://這樣開頭的，如果沒有網(wǎng)絡(luò)，則用戶點擊了超鏈接也無法訪問對應(yīng)的目標(biāo)。
3、本地鏈接指的是本地計算機的地址，一般在地址前面是以 file:///開頭或直接以 C:/、D:/、E:/開頭的，不需要經(jīng)過網(wǎng)絡(luò)。
4、如果href的值留空，則默認是跳轉(zhuǎn)到當(dāng)前頁面，也就是刷新當(dāng)前頁面。
<!DOCTYPE HTML><html lang="en-US"> <head> <title>錨點的使用</title> </head> <body> <a href="#i1">第一章</a> <a href="#i2">第二章</a> <a href="#i3">第三章</a> <div id="i1"> <p>第一章內(nèi)容</p> </div> <div id="i2"> <p>第二章內(nèi)容</p> </div> <div id="i3"> <p> 第三章內(nèi)容</p> </div> </body></html> /*src屬性： 指定圖像的URL地址，是英文source的簡寫，表示引入資源。 src的值可以是本地計算機存儲的圖片的地址，也可以是網(wǎng)絡(luò)上外部網(wǎng)站的圖片的地址。 如果src的值不正確，那么瀏覽器就無法正確的圖片，而是顯示一張裂圖。alt屬性：指定圖像無法顯示時的替換文本。當(dāng)圖像顯示錯誤時，在圖像位置上顯示alt的值。如上所示，就是谷歌瀏覽器中，引入圖像失敗后，顯示了替換文本。alt屬性一般 作為SEO優(yōu)化的手段之一，所以，使用了img標(biāo)簽就需要加上alt屬性。width屬性： 指定引入圖片的顯示寬度。height屬性：指定引入圖片的顯示高度。border屬性：指定引入圖片的邊框?qū)挾?，默認為0。title屬性：懸浮圖片上的提示文字*/點擊圖片跳轉(zhuǎn)可以配合a標(biāo)簽使用<a><img src="" alt=""></a> <ul type="square"> <li>item1</li> <li>item2</li> <li>item3</li> </ul> <ol start="100"> <li>item1</li> <li>item2</li> <li>item3</li> </ol><table border="1"> <tr> <td>單元格的內(nèi)容</td> …… </tr> ……</table>1、table屬性<table>和</table>表示一個表格的開始和結(jié)束。一組<table>...</table>表示一個表格。
2、border用于設(shè)置整個表格的邊框?qū)挾?，默認為0，表示不顯示邊框。
3、<tr>和</tr>表示表格中的一行的開始和結(jié)束。一組<tr>...</tr>，一個表格可以有多行。通過計算table標(biāo)簽中包含多少對tr子標(biāo)簽即可知道一個表格有多少行。
4、<td>和</td>表示表格中的一個單元格的開始和結(jié)束。通過計算一個tr里面包含了多少對td自標(biāo)簽即可知道一個表格有多少列，多少的單元格了。
<h3>用戶注冊</h3> <form action="http://127.0.0.1:8800" method="get"> <p><label for="user">姓名</label>： <input type="text" name="user" id="user"></p> <p>密碼： <input type="password" name="pwd"></p> <p>愛好： <input type="checkbox" name="hobby" value="basketball">籃球 <input type="checkbox" name="hobby" value="football">足球 <input type="checkbox" name="hobby" value="shuangseqiu" checked>雙色球 </p> <p>性別： <input type="radio" name="gender" value="men">男 <input type="radio" name="gender" value="female">女 <input type="radio" name="gender" value="qita">其他 </p> <p>生日：<input type="date" name="birth"></p> <p>籍貫： <select name="province" id="" multiple size="2"> <option value="">浙江省</option> <option value="" selected>浙江省</option> <option value="">浙江省</option> </select> </p> <p> <textarea name="" id="" cols="30" rows="10" placeholder="個人簡介"></textarea> </p> <div> <p><input type="reset" value="重置"></p> <p><input type="button" value="普通按鈕"></p> <p><button>普通按鈕</button></p> <p><input type="submit" value="提交"></p> </div> </form>關(guān)鍵詞：
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。
