CSS定位 元素層級 設定背景

2021-10-24 15:07:13 字數 1181 閱讀 2447

一、定位

當開啟了元素的定位（position屬性值是乙個非static的值）時，

二、相對定位

通常偏移量只需要使用兩個就可以對乙個元素進行定位， 

.box2


.box4
三、絕對定位

.box2


.s1
四、固定定位

.box2
五、元素的層級——z-index
.box2


.box3
父元素的層級再高，也不會蓋過子元素

"box4">


"box5">
呈現結果：

4是橙色沒有蓋住5的藍色

六、設定背景

1、設定元素的透明背景——opacity

.box3
2、背景

（1）使用background-image來設定背景

可以同時為乙個元素指定背景顏色和背景， 

.box1
這裡image和該html檔案在不同的資料夾中，注意相對路徑的寫法

（2）background-repeat用於設定背景的重複方式

.box1
（3）通過background-position可以調整背景在元素中的位置

.box1
（4）background-attachment用來設定背景是否隨頁面一起滾動
body
當背景的background-attachment設定為fixed時，

背景的定位永遠相對於瀏覽器的視窗

body

css設定元素背景

背景background 簡寫形式為 backgroud background color background position background size background repeat background origin background clip background attac...

CSS問題 定位 層級

參考資料 css定位position引發的層級關係問題詳解 概念 用於指定乙個元素在文件中的定位方式 常見語法 static relative absolute sticky fixed 大多數情況下，height和width 被設定為auto的絕對定位元素，按其內容大小調整尺寸。但是，被絕對定位的...

css 設定元素背景為透明

要設定某一元素的背景為透明，在 chrome firefox opera 下是這樣的 background color rgba 0,0,0,0.4 rgba 中的最後乙個引數 0.4 就是想要的透明度，範圍在0 1之間。在 ie 中一般是這樣的 background color rgb 0,0,0...