1. 百度百科上的定義:
HTML的全稱為超文本標(biāo)記語言宰睡,是一種標(biāo)記語言。它包括一系列標(biāo)簽.通過這些標(biāo)簽可以將網(wǎng)絡(luò)上的文檔格式統(tǒng)一菌羽,使分散的Internet資源連接為一個邏輯整體狸捅。HTML文本是由HTML命令組成的描述性文本,HTML命令可以說明文字蔼夜,圖形、動畫压昼、聲音求冷、表格、鏈接等窍霞。
2. webview是什么
瀏覽網(wǎng)頁一般用的是瀏覽器
webview翻譯過來就是網(wǎng)頁查看器, 原理和瀏覽器一樣, 可以看做是瀏覽器
app上都內(nèi)置了webview, 所以可以瀏覽網(wǎng)頁匠题。
3. 常用瀏覽器使用的引擎
谷歌瀏覽器(Google Chrome),采用的是雙內(nèi)核但金,Webkit韭山,Blink;
360安全瀏覽器,采用的也是雙內(nèi)核钱磅,Blink(極速模式)梦裂,Trident(IE)(兼容模式);
360極速瀏覽器盖淡,采用的也是雙內(nèi)核年柠,Blink(極速模式),Trident(IE)(兼容模式)褪迟;
UC瀏覽器冗恨,采用的也是雙內(nèi)核,Blink(極速模式)味赃,Trident(IE)(兼容模式)掀抹;
QQ瀏覽器,采用的也是雙內(nèi)核洁桌,Blink(極速模式)渴丸,Trident(IE)(兼容模式);
Safari瀏覽器另凌,采用的也是單內(nèi)核谱轨,Webkit;
Firefox(火狐)瀏覽器吠谢,采用的也是單內(nèi)核土童,Gecko;
IE瀏覽器工坊,采用的也是單內(nèi)核献汗,Trident;
Microsoft Edge瀏覽器王污,采用的也是雙內(nèi)核罢吃,Blink,Trident(IE)昭齐;
4.Html版本
HTML1.0
HTML2.0
HTML3.2
HTML4.0
HTML4.01(微小改進(jìn))
HTML5:2008年正式發(fā)布,現(xiàn)在都在用第5版的html
5. 文檔類聲明
使用的是html5文檔.<!DOCTYPE html> html的第一句話是文檔類型聲明, 表明了是使用html語言的哪個版本
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
6.HTML XHTML XML的區(qū)別
HTML(Hyper Text Markup Language) 超文本標(biāo)記語言
XHTML (eXtensible HyperText Markup Language) 可擴展超文本標(biāo)記語言, 語法要求比HTML更嚴(yán)格
XML(Extensible Markup Language) 可擴展標(biāo)記語言, 并非像HTML那樣尿招,提供了一組事先已經(jīng)定義好了的標(biāo)簽,而是提供了一個標(biāo)準(zhǔn)阱驾,利用這個標(biāo)準(zhǔn)就谜,可以根據(jù)實際需要定義自己的新的標(biāo)記語言
7. 字符編碼
01 什么是字符編碼
- 在計算機中,所有信息最終都是用二進(jìn)制來表示的里覆。
- 為了在計算機中表示英文中的字符丧荐,美國制定了一套字符編碼,對英文字符與二進(jìn)制位之間做了映射關(guān)系喧枷,這被稱為 ASCII 碼
- 擁有了ASCII碼之后虹统,英文就可以在計算機當(dāng)中完美的表示出來了弓坞,但隨著計算機的普及,其他的國家也要求將自己國家的語言編入計算機當(dāng)中窟却,他們紛紛在基于ASCII碼之上昼丑,編寫了自己的碼表呻逆,比如中國的GB2312夸赫。
02 html中的字符編碼設(shè)置
為了正確顯示HTML頁面,瀏覽器必須知道頁面采用的是什么字符編碼咖城。
<head>
<meta charset="UTF-8">
</head>
03 常見的字符編號
ASCII字符集
ISO字符集
-
Unicode標(biāo)準(zhǔn)
- UTF-8
- UTF-16
GB2312 簡體中文
8.改變圖標(biāo)
想要得到該圖標(biāo)需用到ico轉(zhuǎn)換工具茬腿,自行百度。
<link rel="icon" href="./bitbug_favicon.ico">
9. 標(biāo)簽的使用
<body>
<p>p標(biāo)簽中進(jìn)行換行宜雀,<br>在此處進(jìn)行換行</p>
<hr> <!--水平線的使用 -->
<i>斜體標(biāo)簽</i><br>
<pre>
尊敬的某某:
在此是中國建筑第八工程局某某公司切平,因為你近期幫助我公司
修訂員工手冊,在此提出感謝
xxx
2022年1月1日
</pre>
<b>粗體文本</b> <br>
<em id="aa">強調(diào)文本</em><br>
<ins>被插入文本</ins><br>
<u>下劃線文本</u><br>
<s>加刪除線文本</s><br>
<del>被刪除文本</del><br>
<sub>下標(biāo)文本</sub><br>
<sup>上標(biāo)文本</sup><br>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<p>11111</p>
<span>co<sub>2</sub></span><br> //二氧化碳
<span>m<sup>2</sup></span><br> //平方米
<a target="_self" >搜狗</a><br>
<a target="_block" >搜狗</a><br>
<a target="-block" href="./年齡練習(xí)(if練習(xí)).html">跳轉(zhuǎn)到年齡練習(xí)</a><br>
<a href="#">返回頂部</a> <br>
<a href="#aa">返回aa</a><br>
<a target="_block" href="計算器.html">跳轉(zhuǎn)到計算器</a>
//a標(biāo)簽中target表示網(wǎng)頁跳轉(zhuǎn)時候是內(nèi)部跳轉(zhuǎn)還是外部跳轉(zhuǎn)辐董。href='#'表示回到頂部悴品。#后面可以跟id,表示回到id所在地简烘。
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<p>1111</p>
<div>
<img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF" alt="圖片加載失敗">
<img src="https://cdn2.jianshu.io/assets/default_avatar/7-0993d41a595d6ab6ef17b19496eb2f21.jpg?imageMogr2/auto-orient/strip|imageView2/1/w/240/h/240" alt="圖片加載失敗">
//img中alt表示當(dāng)圖片加載失敗時的提示文字苔严。
</div>
//轉(zhuǎn)移字符
<div>小于號 <
<p>大于號 ></p>
<p>11111 22222</p>
<p>錢¥</p>
</div>
</body>
表格
<table> 定義一個表格
<caption> 定義表格標(biāo)題
<thead> 定義表格中的表頭內(nèi)容
<tbody> 定義表格中的主體內(nèi)容
<tfoot> 定義表格中的表注內(nèi)容(腳注)
<tr> 定義表格中的行
<th> 定義表格中的表頭單元格
<td> 定義表格中單元格
colspan 合并橫向單元格
rowspan 合并豎向單元格
border 邊框
cellspacing=0 合并邊框
合并單元格需要將被合并的單元格注釋掉或者刪除掉
<table border="1" cellspacing="0" width="505px" align="center">
<caption> 表格標(biāo)題</caption>
<thead>
<tr>
<th>姓名</th>
<th>性別</th>
<th>年齡</th>
</tr>
</thead>
<tbody>
<tr>
<td align="center" width="200px" colspan="2" >張三 男</td>
<td align="center">男</td>
</tr>
<tr>
<td align="center" width="200px" rowspan="2">李四</td>
<td align="center">女</td>
<td align="center">22</td>
</tr>
<tr>
<td align="center" width="200px">風(fēng)耳</td>
<td align="center">男</td>
<td align="center">23</td>
</tr>
</tbody>
</table >
表單
01 form
定義一個 HTML 表單
以下三個屬性了解即可, 現(xiàn)在幾乎用不到
- action:規(guī)定當(dāng)提交表單時向何處發(fā)送表單數(shù)據(jù)。
- method:發(fā)送表單數(shù)據(jù)的 HTTP 方法孤澎,get/post届氢。
- target:在何處打開 action URL,取值blank覆旭,self退子。
02 input
輸入控件
- type:指定輸入控件的類型,常用取值:
* text 文本
* password 密碼
* checkbox 多選框
* radio 單選框 需要設(shè)置name
* file 選擇文件或文件夾
* reset 重置表單,只能在表單中才有用
* submit 提交表單
其他控件
placeholder 占位符型将,當(dāng)輸入時消失
value 真正顯示在輸入框中
disabled 禁用輸入框
readonly 文本只讀
maxlength 輸入框中最大字符量
autofocus 自動獲得焦點
label寂祥,實現(xiàn)點擊文字時也可以進(jìn)行選擇
定義 checkbox、radio 元素的標(biāo)注
for:規(guī)定 label 與哪個表單元素綁定 七兜,需要用到id
<!-- 表單 -->
<form action="xxx">
<p>
<input type="text" placeholder="請輸入手機號碼"> <br>
<input type="text" value="12113213"> <br>
<input type="text" disabled placeholder="禁用輸入框"> <br>
<input type="text" readonly placeholder="文本只讀"> <br>
<input type="text" maxlength="11" placeholder="請輸入手機號只能到11位"> <br>
<input type="text" maxlength="11" autofocus placeholder="自動獲得焦點"> <br>
</p>
<p>
<input type="password" placeholder="請輸入密碼">
</p>
<p>
興趣愛好:<br>
<label for="bb">打球</label><input id="bb" type="checkbox">
<label for="cc">休息</label><input id="cc" type="checkbox">
<label for="rest">休息</label><input id="rest" type="checkbox">
</p>
<p>
性別: <br>
<input type="radio" name="aa" id="man"><label for="man">男</label>
<input type="radio" name="aa" id="woman"><label for="woman">女</label>
</p>
<p>
<input type="file">
</p>
<p>
<input type="reset">
</p>
<p>
<input type="submit">
</p>
</form> <br>
文本域
可以通過設(shè)置高寬來調(diào)整文本域大型杵尽(或者通過行數(shù)和列數(shù)進(jìn)行調(diào)整)
<textarea name="" id="" cols="30" rows="10"></textarea> <br>
下拉列表
disabled:禁用。
name:元素名稱惊搏。
<optgroup> 定義下拉列表中的選項組
label:為選項組規(guī)定描述贮乳。
disabled:禁用該選項組。
<option> 定義下拉列表中選項
value:定義送往服務(wù)器的選項值恬惯。
selected:默認(rèn)選中向拆。
disabled:禁用該選項。
<select name="" id="">
<optgroup>
<option value="">貴陽</option>
<option selected value="">遵義</option>
<option value="">都勻</option>
</optgroup>
<optgroup>
<option value="">濰坊</option>
<option value="">濟(jì)南</option>
<option value="">青島</option>
</optgroup>
</select>
button屬性
定義按鈕
type: 規(guī)定按鈕的類型,取值:button, reset, submit,默認(rèn)button
disabled:禁用該按鈕酪耳。
iframe 網(wǎng)頁中的網(wǎng)頁
<body>
<h1>網(wǎng)頁中的網(wǎng)頁</h1>
<iframe src="http://zk.huruqing.cn/" frameborder="1" width="800" height="600"></iframe>
</body>
html5新增標(biāo)簽
自行查看并學(xué)習(xí)浓恳,需記住常用的標(biāo)簽
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<video src=" https://www.w3school.com.cn/i/movie.ogg" autoplay></video>
<audio src=" https://www.w3school.com.cn/i/horse.ogg" controls></audio> <br>
<input type="number"/> <br>
<input type="tel"/> <br>
<input type="date"/> <br>
<input type="color"/> <br>
<input type="datetime"/> <br>
<input type="datetime-local"/> <br>
<input type="email"/> <br>
<input type="month"/> <br>
<input type="range"/> <br>
<input type="search"/> <br>
<input type="time"/> <br>
<input type="url"/> <br>
<input type="week"/> <br>
</body>
</html>
canvas畫布
及畫出統(tǒng)計表子類的標(biāo)簽刹缝,需要用到j(luò)s
<body>
<canvas id="mycanvas" width="800" height="600"></canvas>
<script>
var canvas = document.querySelector('#mycanvas');
var ctx = canvas.getContext('2d');
ctx.moveTo(10,10);
ctx.lineTo(200, 150);
ctx.lineTo(20, 200);
ctx.stroke();
</script>
</body>