02.03.2017 Views

CSS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Background-size: cover<br />

عرض تصویر را با توجه به عرض صفحه بزرگ<br />

میکند ، ارتفاع را نیز با توجه به عرض بزرگ می کند.‏<br />

توجه:به دلیل اینکه ممکن است ارتفاع صفحه کمتر از عرض و یا بر عکس آن باشد بخشی از<br />

تصویر حذف شود و خارج از صفحه قرار بگیرد و نمایش داده نشود<br />

Background-size: contain ارتفاع تصویر را با توجه به ارتفاع صفحه بزرگ می کند و عرض<br />

تصویر را نیز با توجه به ارتفاع تغییر میدهد و نهایتا تمام تصویر نمایش داده میشود.‏<br />

توجه:‏ به دلیل اینکه ممکن است اندازه صفحه بزرگ باشد ، تصویر در تمام صفحه قابل نمایش<br />

نباشد.‏<br />

Background-size: initial<br />

نمایش داده میشود.‏<br />

تصویر پس زمینه بصورت عادی و در اندازه ی واقعی تصویر ،<br />

نکته:‏ به یاد داشته باشید این خاصیت ها در مرور گرهای<br />

پشتیبانی میشود .<br />

IE9+, Firefox, Opera, Chrome, Safari<br />

:Background-repeat<br />

Background<br />

با این خاصیت میتوانید تعیین کنید که تصویر پس زمینه ای که برای<br />

در نظر گرفتید ، تکرار شدنی باشد یا خیر به مثال های زیر توجه نمایید!‏<br />

مثال<br />

Background-repeat: no-repeat<br />

:<br />

تصویر تکرار نشود ‏)به حالت عادی نشان داده میشود(.‏<br />

نحوه نوشتن:‏<br />

Background-repeat: repeat<br />

تکرار میشود و تمام صفحه را می پوشاند(.‏<br />

آموزش کاربردی <strong>CSS</strong>3<br />

Background-repeat:no-repaet;<br />

تصویر تکرار شود ‏)اگر تصویر از حد معمول کوچکتر باشد<br />

نحوه نوشتن:‏<br />

51<br />

‏”رسولی”‏ نویسنده:‏ فردوس

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!