更新時間:2021-03-22 17:48:29 來源:動力節(jié)點 瀏覽1240次
HTML是一種超文本標(biāo)記語言,HTML包括一系列標(biāo)簽,通過這些標(biāo)簽可以將網(wǎng)絡(luò)上的文檔格式統(tǒng)一,使分散的Internet資源連接為一個邏輯整體。本文我們就來為大家普及一下HTML常用標(biāo)簽,為我們學(xué)習(xí)HTML打好基礎(chǔ)。
1.<p>段落標(biāo)簽</p>
用來定義網(wǎng)頁中的一段文本,段落與段落之間換行。
屬性:align ;定義段落中的文本水平方向的對齊方式。
屬性值:left(左對齊)、right(右對齊)、center(居中對齊)
2.<br/>
換行標(biāo)簽,指行與行之間換行,他是一個單標(biāo)簽。
兩者的區(qū)別:
<br/>:是單標(biāo)簽,小行換行提行;
<p></p> :是雙標(biāo)簽,大行換行分段;
3.<h1></h1>---<h6></h6>
<h1></h1>:代表一級標(biāo)題,級別高,字體 也最大,其他依次遞減。
<h6></h6>:級別最小,字體最小
屬性:align ;定義標(biāo)題中的文本水平方向的對齊方式。
屬性值:left(左對齊)、right(右對齊)、center(居中對齊)
4.<blockquote>文字段落縮進(jìn)</blockquote>
在標(biāo)簽中包含塊級標(biāo)簽,而不是純文本。
<blockquote>
<p>自動縮進(jìn)p標(biāo)簽內(nèi)的文本</p>
</blockquote>
5.建立無序列表
<ul type="circle">
<li>列表項</li>
<li>列表項</li>
</ul>
屬性:type ;定義列表項的符號。
屬性值:circle(空心圓)、disc(實心圓)、square(實心方塊)
6.建立有序列表
<ol type="a">
<li>列表項</li>
<li>列表項</li>
</ol>
屬性:type ;定義列表項的符號。 start:用來設(shè)置列表編號的起始數(shù)值。
屬性值:a、A、i、I
7.建立自定義列表
<dl>
<dt>列表標(biāo)題</dt>
<dd>列表項</dd>
<dd>列表項</dd>
</dl>
8.文字特殊樣式
<b>加粗</b>
<i>傾斜</i>
<u>下劃線</u>
<s>刪除線</s>
<big>放大</big>
<small>縮小</small>
<strong>加強強調(diào)</strong>
<em>強調(diào)傾斜</em>
9.<img/>圖片標(biāo)簽
屬性:
src:指定圖片源文件;
alt :圖片未加載成功的提示文字;
width:指定圖片的寬度;
height:指定圖片的高度;
border:指定圖片的邊框樣式;
alghr:top/bottom/middle;圖片位于兩端文字在垂直方向的一個上/中/下的對齊方式;
<img src="http://img5.duitang.com/uploads/item/201610/31/20161031181100_TVEPU.jpeg"/>
10.<a></a>超鏈接
屬性:
href:連接地址;空連接可以用"#"代替;
target :_self/_blank;打開方式;_self在當(dāng)前頁面中打開,_blank在新的空白窗口打開。
<a href="http://baidu.com" target="_blank"></a>
11.div可定義文檔中的分區(qū)或節(jié)(division/section)
<div>是一個塊級元素。這意味著它的內(nèi)容自動地開始一個新行。實際上,換行是 <div> 固有的唯一格式表現(xiàn)。可以通過 <div> 的 class 或 id 應(yīng)用額外的樣式。
<div class="test">111111</div>
12.<span> 標(biāo)簽被用來組合文檔中的行內(nèi)元素。
span標(biāo)簽和div標(biāo)簽是最常用的標(biāo)簽,主要對他們進(jìn)行樣式的應(yīng)用來改變視覺上的變化。
<span>我是span標(biāo)簽</span>
13.<table></table>:表格基本結(jié)構(gòu)
<table>
???<caption>表格標(biāo)題</caption>
?? <tr>
??????? ????<td>我是第一行的第一個單元格</td>
????????????<td>我是第一行的第二個單元格</td>
???? </tr>
??? <tr>
??????? ????<td>我是第二行的第一個單元格</td>
??????? ????<td>我是第二行的第二個單元格</td>
???? </tr>
</table>
14.表單 (form)輸入類型
單選按鈕 (checked默認(rèn))
<input type="radio" name=" " checked />
<input type="radio" name=" " />
復(fù)選按鈕 (checked默認(rèn))
<input type="checkbox" name=" " checked />
<input type="checkbox" name=" " />
密碼輸入框
<input type="password" />
提交按鈕
<input type="submit" />
重置按鈕
<input type="reset" />
普通按鈕
<input type="button" />
圖片按鈕(有提交功能)
<input type="image" />
多行文本框
<textarea cols="一行多少字符" rowa="多少行"><textarea>
列表框
<select size="一次顯示多少個" multiple="可多選">
<option selected>默認(rèn)的下拉菜單1</option>
<option>下拉菜單2</option>
</select>
單行文本框
<input type="text" size="文本框顯示的長度" maxlength="最長字符數(shù)"/>
隱藏域
<input type="hidden"/>
文件域
<input type="file"/>
上述的HTML標(biāo)簽都是我們在使用HTML語言進(jìn)行前端開發(fā)時經(jīng)常要用到的,我們只是簡單的介紹了一下這些標(biāo)簽的定義和作用,實際的應(yīng)用遠(yuǎn)比看上去要復(fù)雜的多。在本站的HTML教程中,我們可以有完整的前端頁面的體系,提供我們進(jìn)行實戰(zhàn)運用這些HTML標(biāo)簽的機會。