溫馨提示×

CSS背景定位屬性background-position怎么設置

css
小億
245
2023-09-28 23:24:39
欄目: 編程語言

CSS背景定位屬性background-position可以用來設置背景圖像的位置。

可以使用以下值來設置background-position屬性:

  • 關鍵字:left、center、right、top、bottom,分別表示背景圖像在容器內的左、中、右、上、下位置。

  • 百分比值:使用百分比值來設置背景圖像的位置,例如50% 50%表示背景圖像在容器的中心位置。

  • 像素值:使用像素值來設置背景圖像的位置,例如10px 20px表示背景圖像左上角距離容器左上角的水平和垂直距離。

  • 組合值:可以將關鍵字、百分比值、像素值進行組合,例如left top表示背景圖像在容器的左上角位置。

以下是一些示例:

background-position: left top;  // 背景圖像在容器的左上角位置
background-position: center;  // 背景圖像在容器的中心位置
background-position: 50% 50%;  // 背景圖像在容器的中心位置
background-position: 10px 20px;  // 背景圖像左上角距離容器左上角的水平和垂直距離分別為10px20px
background-position: right bottom;  // 背景圖像在容器的右下角位置

注意:如果只指定一個值,則另一個值會被設置為默認值center。

0
亚洲午夜精品一区二区_中文无码日韩欧免_久久香蕉精品视频_欧美主播一区二区三区美女