HTML中常用知识点整理
html復(fù)習(xí)
HTML
是一個超文本標(biāo)記語言
w3c標(biāo)準(zhǔn)：結(jié)構(gòu)標(biāo)準(zhǔn)，表現(xiàn)標(biāo)準(zhǔn)，行為標(biāo)準(zhǔn)。
基本結(jié)構(gòu)
<!doctype?html> <html><head><title>網(wǎng)頁的標(biāo)題</title><meta?charset="utf-8"/></head><body></body> </html>基本標(biāo)簽
1.段落標(biāo)簽：
<p></p>2.標(biāo)題標(biāo)簽：
<h1></h1> <h2></h2> <h3></h3> <h4></h4> <h5></h5> <h6></h6>3.換行標(biāo)簽：
<br?/>4.水平線：
<hr/>5.字體樣式標(biāo)簽：
<strong>加粗</strong> <b>加粗</b> <em>斜體</em>6.特殊符號：
大于：>小于：<空格： 引號："版權(quán)符號：©7.圖像標(biāo)簽：
<img?src="圖片路徑"?alt="圖片顯示不出來時顯示的內(nèi)容"?title="鼠標(biāo)懸浮顯示的內(nèi)容"?width="寬度"?height="l高度"??/>相對路徑：相對于當(dāng)前頁面的路徑，eg: ../img.jpg ?img/img.jpg
絕對路徑：相對于本機(jī)的路徑，eg:D:\常用資料\21IT技能大賽\img.jpg
src:圖片的地址（相對路徑和絕對路徑都可以）
alt：圖片顯示不出來時顯示的替換文字內(nèi)容，eg:alt="這是圖書"
title：鼠標(biāo)懸浮時顯示的內(nèi)容，eg:title="這是圖書"
width:圖片顯示的寬度，eg:width="100"
height:圖片顯示的高度，eg:height="100"
8.超鏈接：
<a?href="路徑"?target="是否在當(dāng)前窗口中打開">百度一下</a>href:跳轉(zhuǎn)頁面的地址，相對路徑和絕對路徑都可以
target：有兩個值，_self:當(dāng)前窗口打開超鏈接 _blank:在新窗口中打開超鏈接
9.錨鏈接：
從頁面的甲處跳轉(zhuǎn)到乙處
語法：
甲處：<a?href="#yi">去乙處</a> 乙處：<p?id?=?"yi"></p>10.塊級元素和行內(nèi)元素：
塊級元素：單獨占一行，寬度是瀏覽器的寬度
行內(nèi)元素：內(nèi)容撐開寬度，內(nèi)容多寬，元素就多寬。左右都是行內(nèi)元素，自動排列在一行
列表、表格和媒體元素
1.無序列表：
<ul><li>No.1</li><li>No.2</li><li>No.3</li><li>No.4</li></ul>2.有序列表：
<ol><li>No.1</li><li>No.2</li><li>No.3</li><li>No.4</li></ol>3.定義列表：
<dl><dt>蔬菜</dt><dd>黃瓜</dd><dd>南瓜</dd><dd>冬瓜</dd><dd>北瓜</dd></dl>4.表格：
<table?border="1"?cellspacing="0"?style="text-align:?center;"><tr><td?colspan="3">第一列</td></tr><tr><td?rowspan="2">第一列</td><td>第二列</td><td>最后一列</td></tr><tr><td>第二列</td><td>最后一列</td></tr></table>運(yùn)行結(jié)果：
| 第一列 | ||
| 第一列 | 第二列 | 最后一列 |
| 第二列 | 最后一列 | |
5.音頻元素：
<audio?src="音頻文件"?autoplay="autoplay"?controls="controls"></audio>6.視頻元素：
<video?src="視頻文件"?autoplay="autoplay"?controls="controls"></video>**src：**音頻或者視頻的路徑
**autoplay：**自動播放
**controls：**顯示播放控件
7.網(wǎng)頁結(jié)構(gòu)元素：
<header><nav>導(dǎo)航</nav></header><section>中間</section><footer>底部</footer>表單元素
1.文本框 ：
<input?type="text"?name="name"?value="mxx"?size="20"?maxlength="20"?placeholder="請輸入用戶名"?required="required"?readonly="readonly"?/>type：表單的類型
name：表單元素的名稱
value：默認(rèn)值，初始值
size：表單的初識寬度
maxlength：最大輸入的字符數(shù)
placeholder：提示信息
required：是否必填，不寫的話不用必填
readonly：是否只讀
2.密碼框：
<input?type="password"?name="pass"??/>3.單選按鈕：
<input?type="radio"?name="sex"?/>男 <input?type="radio"?name="sex"?/>女注意：name的值必須要一樣，否則不能單選
4.復(fù)選框：
<input?type="checkbox"??checked="checked?name="hob"?/>打籃球 <input?type="checkbox"?name="hob"?/>堆雪人 <input?type="checkbox"?name="hob"?/>打雪仗注意：checked是默認(rèn)選中的意思，可適用于單選按鈕和復(fù)選框
5.下拉列表：
<select><option>山東</option><option?selected="selected">山西</option><option>河南</option><option>河北</option> </select>注意：selected是默認(rèn)選中
6.按鈕：
<button?disabled="disabled">普通按鈕</button> <input?type="button"?value="普通按鈕"?/> <input?type="reset"?value="重置按鈕"?/> <input?type="submit"?value="提交按鈕"?/>注意：disabled：是禁用按鈕
7.多行文本域：
<textarea?cols="5"?rows="20">歡迎關(guān)注微信公眾號：雄雄的小課堂</textarea>cols：列
rows：行
8.文件域：
<input?type="file"?name="files"?/>9.郵箱：
<input?type="email"?name="files"?/>10.數(shù)字框：
<input?type="number"?min="0"?max="100"?step="100"/>min：最小值
max：最大值
step：步幅
11.滑塊：
<input?type="range"?min="0"?max="100"?step="1"/>12.日期表單：
<input?type="date"?name="borndate"/>13.隱藏域：
<input?type="hidden"?name="id"/>14.語義化標(biāo)簽：
<label>用戶名</label>15.正則表達(dá)式驗證：
<input?type="text"?name="phone"?pattern="^1[3456789]\d{9}"?/>pattern：值是正則表達(dá)式
總結(jié)
以上是生活随笔為你收集整理的HTML中常用知识点整理的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： revit2016电脑配置要求？
- 下一篇： Safari浏览器不支持let声明的解决