本節簡介:講解CSS3新增的圓角、陰影及不透明度等參數設置
本節課同學們做的筆記 點擊播放按鈕可自動定位到對應時間進行播放
opacity:所有元素透明度的意思,取值在0到1,
color:rgba(255,255,0,0.5)a代表alpha通道,表示透明度,取值在0——1之間,0.5代表半透明
box-shadow:添加陰影。第一個值往后代表的意思:X軸,Y軸,模糊值,陰影顏色,加 inset代表內陰影
border-radius:一個字代表四個角,兩個值代表上下 和左右, 三個字 代表 上 左右 下,四個值順時針選
opactiy,也是透明度,但會使元素全部變透明是,但RGB里的a值變化,是背景色變透明,上面的文字不會變。
RGB三原色和透明度,(255,200,1,0.5),最后一個值為透明度(0~1)。
box-shadow:有六個參數,x,y軸偏移,陰影模糊,陰影擴展,陰影顏色,陰影類型
border-radius,兩個值的時候,是代表左上角和右下角,右上角和左下角。四個值時,是順時針的方向。
CSS3新增部分最常用的:圓角,陰影,顏色。但版本低的瀏覽器不支持。
rgba:背景色加透明色,A 表示alpha:0-1
第一值:X值,第二個Y值,第三個模糊值,第四個擴展值,第五個陰影顏色,第六個類型:inset;外陰影不用寫。內陰影寫上inset就可以了
box-shadow:有六個參數,x,y軸偏移,陰影模糊,陰影擴展,陰影顏色,陰影類型
怎么做圓角:border-radius:100px
只讓背景變透明rgba(255,0,0) 讓背景和內容整體透明opacity:0.5