در مطالب قبلی در مورد قرار دادن تصویر پس زمینه در صفحات وب با استفاده از CSS3 نکاتی را به صورت مقدماتی بررسی کردیم.در این آموزش قصد دارم تا یکی از خاصیت هایی که در این زمینه کاربرد دارد را برای شما تشریح کنیم.
خاصیت background-origin :
خاصیت ۸ در CSS 3 ، تعیین کننده نقطه شروع محل قرار گیری پس زمینه عنصر مورد نظر است .
برای مثال می توان تعیین کرد که پس زمینه یک عنصر دقیقا از گوشه بالای سمت چپ عنصر شروع شده و یا مقداری از آن فاصله داشته باشد . همچنین می توانید مکان شروع پس زمینه عنصر را با توجه به محتویات درونی آن تنظیم کنید .
شکل کلی استفاده از این خاصیت به صورت زیر است :
;Syntax: background-origin : value
background-origin : border-box:مثال
در زیر به تشریح هر یک از حالت های ممکن برای خاصیت background-origin می پردازیم .
توضیح هر یک از موارد syntax :
value:
تعیین این پارامتر اجباری است .
این پارامتر تعیین کننده مکان شروع پس زمینه عنصر می باشد و می تواند یکی از ۳ حالت زیر را داشته باشد :
border-box : این خاصیت باعث می شود تا پس زمینه عنصر دقیقا از گوشه سمت چپ و بالای عنصر شروع شود .
این مقدار ، مقدار پیش فرض مرورگر است .
padding-box : در این حالت ، پس زمینه عنصر ، با مقداری فاصله از گوشه بالا و سمت چپ عنصر شروع می شود .
content-box : در این حالت ، نقطه شروع پس زمینه عنصر با توجه به محتویات درونی و محل شروع آن تنظیم می شود .
پشتیانی در مرورگر های مختلف :
این خاصیت در تمام نسخه های جدید مرورگرهای مطرح پشتیانی می شود .
