html超文本標記語言學習筆記(標題標籤/水平線標籤/特殊字符/列表標籤)Day2

Day2

1.標題標籤

  • <h1></h1> <h2></h2> <h3></h3>....<h6></h6>
  • 從h1到h6,大小是依次變小,同時會自動換行

2.水平線標籤

  • <hr/>
  • 屬性:
  • size:水平線的粗細 取值範圍1-7
  • color: 顏色
  • 代碼
  • <hr size="5" color="blue"/>

3.特殊字符

  • 想要在頁面上顯示這樣子的內容<html>
  • 需要對特殊字符進行轉義
  • < : &lt;
  • > : &gt;
  • 空格 : &amp;
    (其他字符需要使用時查詢即可)

4.列表標籤
(1)<dl></dl>:表示列表範圍

  • 在dl裏面 <dt></dt>:上層內容
  • 在dl裏面<dd></dd>:下層內容
<dl>
	<dt>學校</dt>
	<dd>教務部</dd>
	<dd>事務部</dd>
	<dd>財務部</dd>
</dl>

輸出結果:
在這裏插入圖片描述
(2)<ol></ol> :有序列表的範圍

  • 屬性:type :設置排序的方式 1(默認)、a、i
  • 在ol標籤裏面:<li>具體內容</li>
<ol>
	<li>教務部</li>
	<li>事務部</li>
	<li>財務部</li>
</ol>

輸出結果:
在這裏插入圖片描述

<ol type="a">
	<li>教務部</li>
	<li>事務部</li>
	<li>財務部</li>
</ol>

輸出結果:
在這裏插入圖片描述

<ol type="i">
	<li>教務部</li>
	<li>事務部</li>
	<li>財務部</li>
</ol>

輸出結果:
在這裏插入圖片描述
(3)<ul></ul>:表示無序列表的範圍

  • 屬性:type:circle(空心圓)、disc(實心圓,默認)、square(實心方塊)
  • 在ul裏面<li></li>
<ul>
	<li>教務部</li>
	<li>事務部</li>
	<li>財務部</li>
</ul>

輸出結果:
在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章