介紹:
本人自學(xué)前端有一段時間了,但是總覺得個人對基礎(chǔ)掌握的不夠牢固,一直想找個機(jī)會總結(jié)一下自己所學(xué)知識.
剛好機(jī)緣巧合下加入了一個web學(xué)習(xí)交流群,所以借這次機(jī)會,我將對自己學(xué)習(xí)web前端的知識進(jìn)行系統(tǒng)的整理,并把自己的學(xué)習(xí)經(jīng)歷寫成筆記,以便用于日后的回顧和反思.
當(dāng)然再此我要由衷的感謝彎彎姐,彎彎姐的秘書和傳智播客提供的交流平臺.
概要:
- html標(biāo)簽類型
- html常用標(biāo)簽
- html基本文檔格式
內(nèi)容
再此我先提前說明一下我所總結(jié)的內(nèi)容根據(jù)我個人所知而來,所以會有一些
不對或不全面的地方,還請多多包涵和指正,
html標(biāo)簽類型(顯示類型)
HTML標(biāo)記一般分為塊標(biāo)記,行內(nèi)標(biāo)記以及行內(nèi)塊標(biāo)記3種類型，它們也稱塊元素,行內(nèi)塊元素和行內(nèi)元素.
- 塊元素
每個塊元素通常都會獨(dú)自占據(jù)一整行或多整行，可以對其設(shè)置寬度签舞、高度、對齊等屬性，常用于網(wǎng)頁布局和網(wǎng)頁結(jié)構(gòu)的搭建植阴。
常見的塊元素有<h1>~<h6>导帝、<p>、<div>撵彻、<ul>钓株、<ol>、<li>等陌僵，
其中<div>標(biāo)記是最典型的塊元素轴合。
- 行內(nèi)元素
行內(nèi)元素不占有獨(dú)立的區(qū)域，僅僅靠自身的字體大小和圖像尺寸來支撐結(jié)構(gòu)碗短，一般不可以設(shè)置寬度受葛、高度、對齊等屬性，常用于控制頁面中文本的樣式总滩。
常見的行內(nèi)元素有<strong>纲堵、<b>、<em>闰渔、<i>席函、<del>、<s>冈涧、
<ins>茂附、<u>、<a>督弓、<span>等营曼，其中<span>標(biāo)記最典型的行內(nèi)元素。
tip:因為現(xiàn)在強(qiáng)調(diào)標(biāo)簽語義化,所以一般不會用<i>標(biāo)簽來修飾斜體了,
但是我通常會用<i>標(biāo)簽來修飾圖標(biāo)(icon).
- 行內(nèi)塊元素
行內(nèi)塊元素介于行內(nèi)元素和塊元素之間,簡單理解的就是可以設(shè)置大小,寬高的行內(nèi)元素.
常見的行內(nèi)塊元素有 <input>,<img>, <select>,<textarea> 等 .
其中<img>是典型的行內(nèi)塊元素.
tip:每個行內(nèi)元素和行內(nèi)塊元素和它們的父元素是按照基線對
齊排列的,所以有時會出現(xiàn)奇怪的底部縫隙.例如:
inline-block_gap.png
解決辦法:一般我是將img的display樣式修改成block.
html常用標(biāo)簽
這里只對常用標(biāo)簽進(jìn)行一些簡單的描述,具體使用方法,我會在之后的筆記中詳細(xì)介紹.
| 標(biāo)簽 | 描述 |
|---|---|
| meta | 定義了HTML文檔中的元數(shù)據(jù) |
| link | 定義了一個文檔和外部資源之間的關(guān)系 |
| audio | 標(biāo)簽定義聲音愚隧，比如音樂或其他音頻流蒂阱。 |
| video | 標(biāo)簽定義視頻，比如電影片段或其他視頻流 |
| script | 定義了客戶端的腳本文件 |
| span | 提供了一種將文本的一部分或者文檔的一部分獨(dú)立出來的方式狂塘。 |
| div | 標(biāo)簽定義 HTML 文檔中的一個分隔區(qū)塊或者一個區(qū)域部分录煤。 |
| button | 標(biāo)簽定義一個按鈕。 |
| canvas | 標(biāo)簽通過腳本（通常是 JavaScript）來繪制圖形（比如圖表和其他圖像）睹耐。 |
| h1 - h6 | 標(biāo)簽被用來定義 HTML 標(biāo)題辐赞。 |
| table | 標(biāo)簽定義 HTML 表格 |
| strong | 定義重要的文本。 |
| button | 標(biāo)簽定義一個按鈕硝训。 |
| em | 斜體字 |
| ul | 標(biāo)簽定義無序列表响委。 |
| li | 標(biāo)簽定義列表項目 |
| form | 標(biāo)簽用于創(chuàng)建供用戶輸入的 HTML 表單。 |
| img | 標(biāo)簽定義 HTML 頁面中的圖像窖梁。 |
| article | 標(biāo)簽定義獨(dú)立的內(nèi)容 |
| aside | 標(biāo)簽外的內(nèi)容赘风。aside 的內(nèi)容應(yīng)該與附近的內(nèi)容相關(guān),用作文章的側(cè)欄。 |
html基本文檔格式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
