1 css是什么?
層疊樣式表,修飾網頁結構
2 如何去使用css?
a.在html網頁中,加入一個style標簽,在這個style標簽里面寫css代碼
b.可以直接把style里面的代碼放到一個單獨的文件中,通過link標簽去引入 (常用)
c.直接在html開始標簽的style屬性里面去寫css代碼
以上三種方式都可以去設置網頁都樣式
3 css語法規則?要使得html標簽有具體都樣式,需要具備哪些條件?
a. style標簽或者link標簽或者style屬性這幾個都是寫正確
b. 保證css代碼和html代碼產生關聯,產生關聯的方法有多種(id<==>#) 學習到底有多少方法可以關聯html標簽
c. 告訴瀏覽器要把html修飾成什么樣子, 學習各種樣式去修飾html標簽
總結:css要學好,就是要學習兩個東西:1 如何去關聯(查找到對應html標簽)2 如何去修飾這些標簽
書寫css的規則:
選擇器{
屬性名稱:屬性值;
屬性名2:屬性值2;
....
}
選擇器:選擇(查找)html標簽的方法,(#box)
a.id選擇器 #自定義一個名稱
b.類選擇器 .自定義一個名稱
c.標簽選擇器 通過標簽名稱來選擇對應的 html元素
總結:學習了以上三個選擇器(找元素的方法),就可以查找到網頁中任何的元素
剩下要解決的問題:如何去修飾html元素?邊框,顏色,字體,背景?
4 具體的css規則
4.1 顏色的表示方式
a. rgb 模式 r 紅色 g 綠色 b 藍色 紅綠藍三原色可以組成n多顏色 rgb取值范圍(0-255)
b. 直接寫顏色的名稱
c. 十六進制 #9f0000 (最常用)
d. rgba(紅色,綠,藍,透明度) a的取值范圍0-1 0表示完全透明 1 表示不透明
4.2 邊框相關的屬性
border-width 邊框的寬度
border-style 邊框風格
border-color 邊框顏色
border:1px solid red; 簡寫形式
border-left 左邊 border-right 右邊 border-bottom 下邊 border-top
border-radius 邊框圓角
4.3 背景相關的屬性
background-color 背景顏色
background-image 背景圖片
background-repeat 是否重復
background-position 背景位置
4.4 字體相關屬性
font-size: 80px;
/*設置字體顏色*/
color: red;
/*字體加粗*/
/*font-weight: bold;*/
/*定義字體類型*/
font-family:"微軟雅黑",serif;
4.5 文本相關屬性
text-align
text-indent
letter-spacing
line-height
總結:1 css是什么?css有什么用?
2 css如何去使用? 如何去找到對應html元素?如何去修飾這個元素?
找元素的方法-->css的選擇器(id 類 標簽)
掌握css的相關屬性 顏色 邊框 背景 文字 文本