當(dāng)前位置:首頁(yè) > IT技術(shù) > Web編程 > 正文

前端編程筆記--CSS-03
2021-09-18 17:16:46

1)背景:

?

?

背景圖片:

?

?

背景圖片位置

?

也可以寫(xiě)具體數(shù)值?;驍?shù)值與方位名詞混用,(注意順序)

?

?

背景圖片的復(fù)合寫(xiě)法:

?

?

?

?

2) 選擇器的優(yōu)先級(jí):

?注:權(quán)重會(huì)疊加,但不會(huì)進(jìn)位??https://www.bilibili.com/video/BV14J4114768?p=135

?

3)盒子模型

?

?

?

也可以寫(xiě)成復(fù)合形式? ?border : ........... ; 三者之間用空格隔開(kāi)

也可以將邊框分為上下左右來(lái)寫(xiě)? ? border-上下左右 : .......

?

?

?https://www.bilibili.com/video/BV14J4114768?p=141

?

4)邊距

內(nèi)邊距:

?

?外邊距:

?

?

?

?

?

?

?

5)邊框

圓角邊框? ? ? ? ? ?

?

?

6)盒子陰影

?

6)浮動(dòng)

?

?

?

可以用于盒子的重疊

?

?

?

?

?

?

?

?清除浮動(dòng)(eg:不方便直接給出高度時(shí),即高度可變時(shí))

?

?

?

額外標(biāo)簽法:

?

?

 1 .clearfix:after{
 2             content: "";
 3             display: block;
 4             height: 0;
 5             clear: both;
 6             visibility: hidden;
 7         }
 8         .clearfix{
 9             *zoom: 1;
10         }

?

?

?

 1  .clearfix:before,
 2         .clearfix:after {
 3             content: "";
 4             display: table;
 5         }
 6 
 7         .clearfix:after {
 8             clear: both;
 9         }
10 
11         .clearfix {
12             *zoom: 1;
13         }

?

?

?

?

?

以上截圖來(lái)自于:黑馬程序員pink老師前端入門(mén)教程,零基礎(chǔ)必看的h5(html5)+css3+移動(dòng)端前端視頻教程

?

本文摘自 :https://www.cnblogs.com/

開(kāi)通會(huì)員,享受整站包年服務(wù)立即開(kāi)通 >