學習css第三天
感覺今天學的比之前難,但是還能接受。
重點
三大特性
*層疊性*
優先順序同等的情況下 :如果樣式衝突,採取 "就近原則"
*繼承性*
text-,font-,line-這些元素開頭的可以繼承,以及color屬性
子元素可以繼承父元素的樣式
行高的繼承
line-height: 100%;
行高取值為百分比時,先與父元素字型大小進行計算,再繼承給子元素
line-height: 1.5;
行高取值不寫單位時,先繼承給子元素,再與子元素的字型大小進行計算
**優先順序**
當同一個元素指定多個選擇器,就會有優先順序的產生
權重(從小到大)
繼承
權重 "0,0,0,0"
瀏覽器預設樣式
萬用字元選擇器
權重 "0,0,0,0"
標籤選擇器
權重 "0,0,0,1"
類選擇器,偽類選擇器
權重 "0,0,1,0"
id選擇器
權重 "0,1,0,0"
行內樣式表
權重 "1,0,0,0"
!important
權重最高的
權重會疊加,但是不進位
權重高的優先順序高
權重一樣,則看層疊性
盒子模型
1.盒子包含的四大部分
1.實際內容
2.內邊距
3.邊框
4.外邊距
邊框–border
border——width 邊框粗細
border——style 邊框樣式
border——color 邊框顏色
border——collapse:collapse 細線 邊框
內邊距——padding:left 左邊距
top 上邊距
bottom 下邊距
right 右邊踞
複合寫法
padding:5px 上下左右
5px 10px 上下5px 左右10px
5px 10px 5px 上下5px 左右20px 下px
5px 10px 5px 5px
上 右 下 左
border–style
solid 實線 dashed 虛線 dotted 點線
外邊距 margin
控制盒子盒子的距離
盒子水平居中 margin:auto
li去黑點
list–style:none
相關文章
- golang學習第三天Golang
- java學習第三天2020/7/8Java
- 釘釘學習第三天作業
- web前端學習之路的第三天Web前端
- 學習CSSCSS
- CSS學習CSS
- 在樂位元組學習的第三天
- 蒼穹外賣學習筆記——第三天筆記
- CSS的學習CSS
- 學習python的第三天;正試學習python的第二節課Python
- [譯] 如何學習 CSSCSS
- 【譯】如何學習CSSCSS
- css套路學習(一)CSS
- CSS 學習筆記CSS筆記
- CSS學習內容CSS
- Selenium學習第三天--模組化設計用例
- (CSS學習記錄):CSS高階技巧CSS
- CSS學習-Flex佈局複習CSSFlex
- css學習筆記(一)CSS筆記
- css學習-盒子模型CSS模型
- CSS 學習路線圖CSS
- 學習H5&CSSH5CSS
- 小碼哥iOS學習筆記第三天: isa和superclassiOS筆記
- 張老師複習第三天
- 複習Java的第三天3.20Java
- JavaScript學習第三天(函式的定義,引數,閉包)JavaScript函式
- 學習css之box-shadowCSS
- CSS 基礎學習筆記CSS筆記
- Animation.css學習筆記CSS筆記
- webpack學習(四) -- css tree shakingWebCSS
- CSS學習摘要-定位例項CSS
- 前端學習記錄(CSS篇)前端CSS
- div+css學習筆記CSS筆記
- HTML&CSS學習筆記HTMLCSS筆記
- CSS學習(二)選擇符CSS
- css居中辦法學習筆記CSS筆記
- webpack 學習筆記:引入 CSS(下)Web筆記CSS
- webpack 學習筆記:引入 CSS(上)Web筆記CSS