CSS核心基础
CSS核心基礎
CSS樣式規則
在HTML中，引入CSS的方法 主要有：行內式、內嵌式、導入式、鏈接式4種。
1.行內式：在標記的style屬性中設定CSS樣式，這種方式本質上沒有體現出CSS的優勢，因此不推薦使用。
2. 嵌入式：對頁面中的各種元素的設置集中在<head></head>之間。
3. 導入式和鏈接式：目的都是將一個獨立的CSS文件引入HTML文件中。鏈接式使用HTML的標記引入外部CSS文件，如
<link href="mystyle.css" rel="stylesheet" type="text/css" />.導入式需使用： <style type="text/css"> @import"mystyle.css";</style>
基本CSS選擇器
標記選擇器、類別選擇器和ID選擇器3種。
1 標記選擇器
選擇器包含： 選擇器本身、屬性和值。
如 h1{ color:red,font-size:12px;}.
2 類別選擇器
類別選擇器的名稱由用戶自定義，屬性和值跟標記選擇器一樣，也必須符合CSS規范。 如 .class{color:green;}
最好通過標記選擇器定義 標記的全局顯示方案，再通過clss選擇器突出標記進行單獨設置。這樣可提高代碼的編寫效率。
3 ID選擇器
ID選擇器只能在HTML頁面中使用一次，針對性更強。
CSS文本外觀屬性
1文本顏色
顏色屬性被用來設置文字的顏色。
顏色是通過CSS最經常的指定：
十六進制值 - 如: ＃FF0000
一個RGB值 - 如: RGB(255,0,0)
顏色的名稱 - 如: red
例如：
body {color:red;}
h1 {color:#00ff00;}
h2 {color:rgb(255,0,0);}
2文本的對齊方式
文本排列屬性是用來設置文本的水平對齊方式。
文本可居中或對齊到左或右,兩端對齊.
當text-align設置為"justify"，每一行被展開為寬度相等，左，右外邊距是對齊（如雜志和報紙）。
例如：
h1 {text-align:center;}
p.date {text-align:right;}
p.main {text-align:justify;}
3文本修飾
text-decoration 屬性用來設置或刪除文本的裝飾。
從設計的角度看 text-decoration屬性主要是用來刪除鏈接的下劃線：
例如：
a {text-decoration:none;}
4文本轉換
文本轉換屬性是用來指定在一個文本中的大寫和小寫字母。
可用于所有字句變成大寫或小寫字母，或每個單詞的首字母大寫。
例如：
p.uppercase {text-transform:uppercase;}
p.lowercase {text-transform:lowercase;}
p.capitalize {text-transform:capitalize;}
5文本縮進
文本縮進屬性是用來指定文本的第一行的縮進。
例如：
p {text-indent:50px;}·
以下是本節構圖：
作業：
運行結果：
總結
- 上一篇： maven复习 (进阶+高级)
- 下一篇： css图形动画,CSS3 实现图形下落动