background-positionª©¥»¡GCSS1¡@ ­Ý®e©Ê¡GIE4+ NS6+¡@Ä~©Ó©Ê¡GµL
»yªk¡G
background-position : length || length
background-position : position || position
¨ú­È¡G
length :’¦ʤÀ¼Æ | ¥Ñ¯BÂI¼Æ¦r©M³æ¦ì¼ÐÃѲŲզ¨ªºªø«×­È¡C½Ð°Ñ¾\ ªø«×³æ¦ì
position :’Âtop | center | bottom | left | center | right
»¡©ú¡G
³]¸m©ÎÀ˯Á¹ï¶Hªº­I´º¹Ï¹³¦ì¸m¡C¥²¶·¥ý«ü©w background-image ÄÝ©Ê¡C
¸ÓÄÝ©Ê©w¦ì¤£¨ü¹ï¶Hªº¸É¤BÄÝ©Ê( padding )³]¸m¼vÅT¡C
Àq»{­È¬°¡G 0% 0% ¡C¦¹®É­I´º¹Ï¤ù±N³Q©w¦ì©ó¹ï¹³¤£¥]¬A¸É¤B( padding )ªº¤º®e°Ï°ìªº¥ª¤W¨¤¡C
¦pªG¥u«ü©w¤F¤@­Ó­È¡A¸Ó­È±N¥Î©ó¾î§¤¼Ð¡CÁa§¤¼Ð±NÀq»{¬° 50% ¡C¦pªG«ü©w¤F¨â­Ó­È¡A²Ä¤G­Ó­È±N¥Î©óÁa§¤¼Ð¡C
¦pªG³]¸m­È¬° right center ¡A¦]¬° right §@¬°¾î§¤¼Ð­È±N·|Âл\ center ­È¡A©Ò¥H­I´º¹Ï¤ù±N³Q©~¥k©w¦ì¡C
¹ïÀ³ªº¸}¥»¯S©Ê¬° backgroundPosition ¡C
¥Ü¨Ò¡G
div { background: url("images/aardvark.gif"); background-position: 35% 80%; }
menu { background: url("images/aardvark.gif"); background-position: 35% 2.5cm; }
a { background: url("images/aardvark.gif"); background-position: 3.25in; }
body { background: url("images/aardvark.gif"); background-position: top right; }