صفت background-origin
بازگشت به صفحه اصلی
بازگشت به صفحه مقاله
دو ستونی
دو سطری
اجرای کد RUN »
<!DOCTYPE html> <html> <head> <style> #example1 { border: 10px solid black; padding: 35px; background: url(http://cp.webmehraz.com//Files/Tutorial/10225/img_flwr.gif); background-repeat: no-repeat; } #example2 { border: 10px solid black; padding: 35px; background: url(http://cp.webmehraz.com//Files/Tutorial/10225/img_flwr.gif); background-repeat: no-repeat; background-origin: border-box; } #example3 { border: 10px solid black; padding: 35px; background: url(http://cp.webmehraz.com//Files/Tutorial/10225/img_flwr.gif); background-repeat: no-repeat; background-origin: content-box; } </style> </head> <body> <p> background-origin (padding-box پیش فرض):</p> <div id="example1" dir="rtl"> <h2>یک تیتر تست</h2> <p>این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.</p> <p>این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.</p></div> <p>background-origin: border-box:</p> <div id="example2" dir="rtl"> <h2>یک تیتر تست</h2> <p>این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.</p> <p>این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.</p></div> <p>background-origin: content-box:</p> <div id="example3" dir="rtl"> <h2>یک تیتر تست</h2> <p>این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.</p> <p>این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.این یک متن ساختگی برای نمایش نتیجه کد ها می باشد.</p></div> </body> </html>