Stretch کردن تصویر پس زمینه توسط CSS

[LORD AELX]

من داشتم قالب blogger ام رو ادیت می کردم، ولی به یه مشکل برخوردم و اون اینکه عکسی که برای پس زمینه انتخاب کرده بودم عرض کمتر از 1152px داره و با repeat کردنش در عرض، حدود یک چهارم تصویر تکرار میشه. سعی کردم با مقدار دهی خصوصیت ;background-size: 100% درستش کنم ولی نشد!! background-width رو هم تست کردم ولی جواب نداد. اینم اضافه کنم که من تصویر پس زمینه رو fixed کردم.

کسی میتونه به من کمک کنه؟

متشکرم :قلب:

[eshpilen]

خب عکست رو بزرگ کن!
بعدشم برای اینطور موارد من قبلا راهی پیدا نکردم جز اینکه یک تصویر (با تگ img) زیر تمام محتویات دیگه بذارم و سایزش رو 100% کنم. البته این روش سنگینی رندر شدن صفحه رو به نحو قابل توجهی افزایش میده.

[LORD AELX]

خب عکست رو بزرگ کن!
بعدشم برای اینطور موارد من قبلا راهی پیدا نکردم جز اینکه یک تصویر (با تگ img) زیر تمام محتویات دیگه بذارم و سایزش رو 100% کنم. البته این روش سنگینی رندر شدن صفحه رو به نحو قابل توجهی افزایش میده.

بزرگ کردن عکس حجمش رو چند برابر می کنه، ضمن اینکه اگر رنگ پس زمینه رو سیاه کنم، قسمتی در سمت راست بلاگ، یخورده ضایع میشه... بگذریم، ولی یه سوال... :متفکر: من رزولوشن صفحه ام 864*1152 هست. فکر می کنی این رزولوشن رایج باشه؟! یا خیلی ها از رزولوشن بیشتری استفاده می کنند؟؟!!

[eshpilen]

بزرگ کردن عکس حجمش رو چند برابر می کنه، ضمن اینکه اگر رنگ پس زمینه رو سیاه کنم، قسمتی در سمت راست بلاگ، یخورده ضایع میشه... بگذریم، ولی یه سوال... :متفکر: من رزولوشن صفحه ام 864*1152 هست. فکر می کنی این رزولوشن رایج باشه؟! یا خیلی ها از رزولوشن بیشتری استفاده می کنند؟؟!!

عکس بزرگ بشه به همون نسبت که حجمش زیاد نمیشه. چون فشرده سازی صورت میگیره.

رزولیشن خودم که همیشه 1024*768 هست (با مانیتورهای 17 اینچ عادی).
توی سایت شرکت که خودم طراحی کردم اسکریپتی گذاشتم که رزولیشن صفحهء کاربران رو ثبت میکنه بخاطر اینکه جواب همین سوال رو بفهمم، ولی ظاهرا فایده نداره چون بیشتر از همه خودمون از سایت شرکت بازدید میکنیم بعدشم معلوم نیست کدوم خودمون بودیم کدوم کس دیگه :لبخند:

بهرحال فکر میکنم در این زمینه سایتهای آماری با آمار نسبتا قابل اعتماد وجود داشته باشه که جستجو بکنی پیدا بشن. نه؟ اگر پیدا کردی به منم اطلاع بده.

[LORD AELX]

بهرحال فکر میکنم در این زمینه سایتهای آماری با آمار نسبتا قابل اعتماد وجود داشته باشه که جستجو بکنی پیدا بشن. نه؟ اگر پیدا کردی به منم اطلاع بده.

ویکیپدیا میگه اکثر وبسایت ها از رزولوشن 800x600 به عنوان رزولوشن استاندارد استفاده می کنند (* (http://en.wikipedia.org/wiki/Display_resolution)).
W3Schools هم طبق آماری که در ماه ژانویه هر سال به روز می شود، اعلام کرده که 76% از کاربران از رزولوشن 1024x768 یا بیشتر استفاده می کنند (* (http://www.w3schools.com/browsers/browsers_display.asp)).
سایت hypergurl هم با آماری جزئی تر، به ترتیب رزولوشن 1024x768 و 1280x1024 را رایج ترین رزولوشن های استفاده شده میان کاربران وب اعلام می کند (* (http://www.hypergurl.com/blog/webdesign/monitor-resolution-standards.html)).

+ این هم آمارها و نظرات دیگر به همراه توضیحات بیشتر:

http://articles.techrepublic.com.com/5100-10878_11-6081709.html
http://www.webdesignoffice.us/portfolio-and-design/q-t-title-Standard-Resolution-for-web-sites.html
http://answers.google.com/answers/threadview?id=341264

موفق باشید :قلب:

[yanis_1984]

ساده ترین راه حل اینه که کناره های تصویر رو با فتوشاپ Fade بدیش بعد تصویر رو وسط چین کنیش و رنگ بکگراندت روهم سازگار باعکس کنیش.

[Tiger_ehsan]

نمیدونم ج.ابی که دارم میگم درسته یا نه به نظر من اینکارو کن

همچین مشکلی برا من پیش اومده بود من از این روش استفاده کردم جواب داد

سایز بک گراند تصویرو از 100 درصد بردم بالا
background-size:150%;

[tamafi6]

دوست عزیزیک نگاه به اینجابندازمبحث کامل هست موفق باشی

http://barnamenevis.org/showthread.php?406840-%DA%86%DB%8C%D8%AF%D9%85%D8%A7%D9%86-%D8%A8%DA%A9-%DA%AF%D8%B1%D8%A7%D9%86%D8%AF%D9%87%D8%A7-%D8%A8%D9%87-%D8%B5%D9%88%D8%B1%D8%AA-%D9%84%D8%A7%DB%8C%D9%87-%D8%A8%D9%87-%D9%84%D8%A7%DB%8C%D9%87