CSS background-position 灞炴


瀹炰緥

濡備綍瀹氫綅background-image锛

body
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}

灏濊瘯涓涓 禄

鏍囩瀹氫箟鍙婁娇鐢ㄨ鏄

background-position灞炴ц缃儗鏅浘鍍忕殑璧峰浣嶇疆銆

娉ㄦ剰瀵逛簬杩欎釜宸ヤ綔鍦‵irefox鍜孫pera锛宐ackground-attachment蹇呴』璁剧疆涓 "fixed锛堝浐瀹氾級".

榛樿鍊: 0% 0%
缁ф壙: no
鐗堟湰: CSS1
JavaScript 璇硶: object object.style.backgroundPosition="center"


娴忚鍣ㄦ敮鎸

拉群的一分快三—官方网址22270.COM琛ㄦ牸涓殑鏁板瓧琛ㄧず鏀寔璇ュ睘鎬х殑绗竴涓祻瑙堝櫒鐗堟湰鍙枫

灞炴
background-position 1.0 4.0 1.0 1.0 3.5

娉ㄦ剰: IE8 鍙婃洿鏃╃殑娴忚鍣ㄧ増鏈笉鏀寔涓涓厓绱犳湁澶氫釜鑳屾櫙鍥剧墖銆


灞炴у

鎻忚堪
left top
left center
left bottom
right top
right center
right bottom
center top
center center
center bottom
濡傛灉浠呮寚瀹氫竴涓叧閿瓧锛屽叾浠栧煎皢浼氭槸"center"
x% y% 绗竴涓兼槸姘村钩浣嶇疆锛岀浜屼釜鍊兼槸鍨傜洿銆拉群的一分快三—官方网址22270.COM宸︿笂瑙掓槸0锛0锛呫拉群的一分快三—官方网址22270.COM鍙充笅瑙掓槸100锛100锛呫傚鏋滀粎鎸囧畾浜嗕竴涓硷紝鍏朵粬鍊煎皢鏄50锛呫 銆傞粯璁ゅ间负锛0锛0锛
xpos ypos 绗竴涓兼槸姘村钩浣嶇疆锛岀浜屼釜鍊兼槸鍨傜洿銆傚乏涓婅鏄0銆傚崟浣嶅彲浠ユ槸鍍忕礌锛0px0px锛夋垨浠讳綍鍏朵粬 CSS鍗曚綅銆傚鏋滀粎鎸囧畾浜嗕竴涓硷紝鍏朵粬鍊煎皢鏄50锛呫備綘鍙互娣峰悎浣跨敤锛呭拰positions
inherit 鎸囧畾background-position灞炴ц缃簲璇ヤ粠鐖跺厓绱犵户鎵


Examples

鍦ㄧ嚎瀹炰緥

濡備綍璁剧疆椤甸潰鑳屾櫙鍥惧儚
杩欎釜渚嬪瓙婕旂ず浜嗗浣曞湪椤甸潰涓婅缃産ackground-image銆

濡備綍浣跨敤锛呮潵瀹氫綅鑳屾櫙鍥惧儚
杩欎釜渚嬪瓙婕旂ず浜嗗浣曚娇鐢紖璁剧疆椤甸潰涓婄殑鍥惧儚浣嶇疆銆

濡備綍浣跨敤鍍忕礌鏉ュ畾浣嶈儗鏅浘鍍
杩欎釜渚嬪瓙婕旂ず浜嗗浣曚娇鐢ㄥ儚绱犺缃〉闈笂鐨勫浘鍍忎綅缃


鐩稿叧鏂囩珷

CSS 鏁欑▼: CSS Background

CSS 鍙傝冩墜鍐: background-image 灞炴