有序列表

• 使用ol和li來建立一個有序列表

<ol>
	<li>列表項1</li>    1.列表項1
	<li>列表項2</li>    2.列表項2
	<li>列表項3</li>    3.列表項3
</ol>

無序列表

• 使用ul和li來建立一個無序列表。

 - <ul> 	
  	<li>列表項1</li>    ●列表項1 	
  	<li>列表項2</li>    ●列表項2 	
  	<li>列表項3</li>    ●列表項3

 

定義列表

• 使用dl、dd、dt來建立一個定義列表

<dl>
	<dt>定義項1</dt>     定義項1
	<dd>定義描述1</dd>       定義描述1
	<dt>定義項2</dt>     定義項2
	<dd>定義描述2</dd>       定義描述2
	<dt>定義項3</dt>     定義項3
	<dd>定義描述3</dd>       定義描述3

單位

• px
  • 如果我們將一個圖片放大的話，我們會發現一個圖片是有一個一個的小色塊構成的，這一個小色塊就是一個畫素，也就是1px，對於不同的顯示器來說一個畫素的大小是不同的
• 百分百
  • 也可以使用一個百分數來表示一個大小，百分比是相對於父元素來說的，如果父元素使用的大小是16px，則100%就是16px，200%就是32px
• em
  • em和百分比類似，是相對於font-size說的
    • 1em=1font-size

顏色

• 在CSS中可以直接使用顏色的關鍵字來代表一種顏色
• 17中顏色：aqua,black,blue,fuchsia,gray,green,lime,maroon,navy,olive,orange,purple,red,silver,teal,white,yellow
• 還有147種svg顏色，這裡就不一一列舉了，但是明顯即使這些顏色程式設計double，也不足以描繪我們世界中所有顏色

十六進位制顏色

• 用的最多的顏色是十六進位制符號。一個顏色值，比如：#6600ff實際上包含了三組十六進位制的數字
• 上邊的例子種66代表紅色的濃度，00代表綠色的濃度，ff代表了藍色的濃度。最後的顏色是由這些指定濃度的紅綠藍混合而成的。
• 如果每一組數種的兩個數字都相同，就可以把十六進位制的數字縮短為只有3個字元，如將#6600ff縮短為#60f

RGB值

• 也可以使用計算機種常用的RGB值來表示顏色。可以使用0-255的數值，也可以使用0%-100%的百分比數。
  • RGB（100%，0%，0%）
  • RGB（0，255，0）
• 第一個數表示紅色的濃度，第二個數表示綠色濃度，第三個數表示藍色的濃度

RGBA

• RGBA表示一個顏色和RGB類似，只不過比RGB多了一個A（alpha）來表示透明度，透明度需要一個0-1的值。0表示完全透明，1表示完全不透明。
  • RGBA（255,100,5,0.5）

文字大小

• font-size用來指定文字的大小

字型（一）

• 通過font-family可以指定標籤種文字使用的字型。
• 例如：
  p{font-family:Arial}
  上邊這行程式碼指定了p標籤種使用名為arial作為字型
• 一般來說只有使用者計算機種安裝了我們指定了字型時，它才會顯示，否則這行程式碼是沒有意義的

字型（二）

• 通過font-family可以同時指定多個字型
• 例如：
  p{font-family:Arial,Helvetica,sans-serif}
• 如上實際上指定了三種字型，那麼到底使用的是哪個呢？瀏覽器會優先使用第一個，如果沒有找到則使用第二個，以此類推
• 這裡面sans-serif並不是指的具體某個字型。而是一類字型

字型分類

• serif（襯線字型）
• sans-serif（非襯線字型）
• monospace(等寬字型)
• cursive(草書字型)
• fantasy(虛幻字型)
• 以上這些分類都是一些大的分類，並沒有涉及具體的型別，如果將字型指定為這些格式，瀏覽器會自己選擇指定型別的字型

斜體和粗體

• font-style用來指定文體的斜體
  • 指定斜體：font-style:italic
  • 指定非斜體：font-style:normal
• font-weight用來指定文字的粗體
  • 指定粗體：font-weight:bold
  • 指定非粗體：font-weight:normal

小型大寫字母

• font-variant屬性可以將字母型別設定為小型大寫。在該樣式中，字母開起來像是稍微縮小了尺寸的大寫字母
• font-variant:small-caps

字型屬性的簡寫

• font可以一次性同時設定多個字型的樣式
• 語法：font:加粗 斜體 小型大寫 大小/行高 字型
• 這裡前邊幾個加粗、斜體和小型大寫的順序無所謂，也可以不寫，但是大小和字型必須寫且必須寫到後兩個

行間距

• line-height 用於設定行高，行高越大則行間距越大
• 行間距：line-height -（減法）font-size

大寫化

• text-transform樣式用於將元素中的字母全都變成大寫
  • 大寫：text-transform:uppercase
  • 小寫：text-transform:lowercase
  • 首字母大寫：text-transform:capitalize
  • 正常：text-transform:none

文字的修飾

• text-decoration屬性，用來給文字新增各種修飾，通過它可以為文字的上方、下方或者種鍵新增線條
• 可選值：
  • underline
  • overline
  • line-through
  • none

字母間距和單詞間距

• letter-spacing用來設定字元之間的間距
• word-spacing用來設定單詞之間的間距
• 這兩個屬性都可以直接指定一個長度或百分數作為值。正數代表的是增加距離，而負數代表減少距離

對齊文字

• text-align用於設定文字的對齊方式
• 可選值：
  • left:左對齊
  • right:右對齊
  • justify:兩邊對齊
  • center:居中對齊

首行縮排

• text-indent用來設定首行縮排
• 該樣式需要指定一個長度，並且只對第一行生效