CSS中的背景小知識

2021-10-06 05:27:08 字數 1022 閱讀 2001

1.css中的背景有很多屬性,在寫的時候可以用background:***  *** 寫在一起;也可以分開寫,如background-color;background-image等等

2.背景顏色的寫法

1.    顏色名(red、green、whitesmoke......)

2. 十六進製制(#ff0000 可縮寫為 #f00)

3. rgb(0~255,0~255,0~255,.2) 可在0~255取值, ".2"表示透明度

4. hsl(0,xx%,xx%) "0"指定色相,後面兩個百分數分別指定飽和度和亮度(即透明度)

3.背景圖設定

background-image: url(路徑)    //路徑無需帶引號

background-size: xxpx //設定背景圖的尺寸大小

background-repeat: no-repeat/repeat-x/repeat-y //設定背景圖的平鋪方式

background-position: (1)center/top/bottom(粗定位)

(2)xxpx xxpx (細定位)————指定相對於容器水平移動xxpx,垂直移動xxpx

4.背景圖漸變屬性

//toright指定漸變方向,從左向右;red指定漸變開始的顏色,green指定漸變結束的顏色

linear-gradient(toright, red, green)

//***deg也是指定漸變方向,0deg:下——>上; 45deg:左下——>右上;90deg:左——>右; 180deg:上——>下

linear-gradient(***deg, red, green)

//xx%指定前面的顏色佔漸變的比例

linear-gradient(***deg, red, xx%, green, xx%, 顏色名, xx%)

5.適配移動端時,要縮小,以適應移動裝置的高解析度

關於css的小知識

關於css的小知識以及例子 關於元素的隱藏 display和visibility的區別。1 display none 元素隱藏後不占有空間 2 visibility hidden 元素隱藏後占有空間 box shadow 陰影 的使用 box shadow 1px 2px 3px 4px red i...

CSS基礎知識 backgroung(背景)

背景圖 background 縮寫形式 background color 背景顏色 語法 background color 顏色 background image 背景 語法 background image url background repeat 背景圖重複位置 其屬性值可以為 repeat ...

CSS日常小知識

假如有乙個padding border margin 與其他的三條邊不同,其他三條邊一樣,這個時候我們設定總體樣式,再單獨去設定它的樣式。border 5px solid red css 層疊特效 border bottom 10px dashed green 有一些標籤會有預設的樣式,比如預設的m...