Style backgroundPosition ປະສົມປະກອບ

ການກຳນົດ ແລະ ການນໍາໃຊ້

backgroundPosition ການກຳນົດ ແລະ ການຈັດກຽມຕັດຕາວັດຖານພາບຫຼັງໃນປະຕູວັດ:

ບໍ່ບໍ່ບັນຈຸ:

ຈຸດງານ HTML:ປະສົມປະກອບ background

ການຄົ້ນຄວ້າ CSS:ບໍລິເວນສະໜາມ

ການຄົ້ນຄວ້າ CSS3:ການຄົ້ນຄວ້າ CSS3 ພາບຫຼັງ

ປື້ມການອະທິບາຍ CSS:ປະສົມປະກອບ background-image

ປື້ມການອະທິບາຍ CSS:ປະສົມປະກອບ background-position

ຄວາມຄິດຕົວ

ຕົວຢ່າງ 1

ການປ່ຽນຕັດຕາວັດຖານຂອງພາບຫຼັງ:

document.body.style.backgroundPosition = "top right";

亲自试一试

ຕົວຢ່າງ 2

ການປ່ຽນຕັດຕາວັດຖານຂອງພາບຫຼັງພາບ <div> ຕັ້ງຢູ່ທາງລຸ່ມກາງ:

document.getElementById("myDiv").style.backgroundPosition = "center bottom";

亲自试一试

例子 3

将

元素中背景图像的位置更改为水平 200 像素和垂直 40 像素：

document.getElementById("myDiv").style.backgroundPosition = "200px 40px";

亲自试一试

例子 4

返回

元素中背景图像的位置：

document.getElementById("myDiv").style.backgroundPosition;

亲自试一试

语法

返回 backgroundPosition 属性：

object.style.backgroundPosition

设置 backgroundPosition 属性：

object.style.backgroundPosition = value

属性值

值 描述
  • top left
  • top center
  • top right
  • center left
  • center center
  • center right
  • bottom left
  • bottom center
  • bottom right
 如果您只规定一个关键字，则另一个值将是 "center"。
x% y%

x 值表示水平位置，y 值表示垂直位置。

左上角是 0% 0%。右下角是 100% 100%。

如果您只规定一个值，则另一个值为 50%。
xpos ypos

x 值表示水平位置，y 值表示垂直位置。

ປະຕູສູນທີ່ຢູ່ທາງສາຍເທິງທາງສັງຫານແມ່ນ 0 0。ອັນດັບຈຸດສະນະສາມາດແມ່ນຕົວຊີ້ (0px 0px) ຫຼືອັນດັບຈຸດສະນະ CSS ອື່ນໆຫຼືບໍ່ຈະມີອັນດັບຈຸດສະນະ CSS ອື່ນໆ。

ຖ້າເຈົ້າພົບພຽງໜຶ່ງຄວາມສະແດງພຽງໜຶ່ງຈະຖືກຈັດໃຫ້ສູງ 50%。ຈະສາມາດປະສົມກັນ % ແລະອັນດັບຈຸດສະນະ CSS ອື່ນໆຫຼືບໍ່ຈະມີອັນດັບຈຸດສະນະ CSS ອື່ນໆ。
initial ຈະຕັ້ງຄວາມສະແດງປະກອບນີ້ໃຫ້ເປັນຄວາມສຳຄັນເກົ່າຂອງມັນ。ບັງຄັບເບິ່ງ: initial。
inherit ຈະລວມການສະແດງປະກອບທີ່ມາຈາກປະກອບພໍ່ຂອງມັນ。ບັງຄັບເບິ່ງ: inherit。

ລາຍລະອຽດດ້ານເຕັກນິກ

ຄວາມສຳຄັນເກົ່າ: 0% 0%
ຄວາມຮັບຜິດຊອບ: ສະແນນຄວາມສະແດງຫົວຂໍ້ຂອງພາບຫຼັງການສະແດງ。
ບັນດາບັນນາທິການ CSS: CSS1

ການສະໜັບສະໜູນບັນດາບັນນາທິການ

backgroundPosition ເປັນລັກສະນະ CSS1 (1996)。

ທຸກບັນດາບັນນາທິການສາມາດສະໜັບສະໜູນມັນຢ່າງເຕັມທີ່:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ ການສະໜັບສະໜູນ