ورود

نسخه کامل مشاهده نسخه کامل : قرار دادن یک عکس به جای Border


David.Jn
29-01-2012, 17:13
درCSS این قابلیت وجود دارد که از عکس به جای Border‌ استفاده کرد
این پراپرتی در CSS3 به نام image-border وجود دارد که برخی از مروزگرها هنوز این استاندارد جدید را ساپورت نمی‌کنند و برای این کار از سینتکس متفاوتی میتوان استفاده کرد ، البته به غیر IE :(

پارامترهای این پرارتی عبارتند از:

url
آدرس عکس مورد نظر

slice

عدد اول برای برش قسمت بالا به صورت افقی
عدد دوم برای برش قسمت راست به صورت عمودی
عدد سوم برای برش قسمت پایین به صورت افقی
عدد چهارم برای برش سمت چپ به صورت عمودی


strech


نکته‌ای که باید در نظر بگیرید Transparent بودن عکس برای قسمت داخلی عکس می‌باشد (برای درج مطالب)

مثال زیر نمونه‌ای از استفاده از این ویژگی و سینتکس آن در مرورگرهای مختلف:


[ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ]



برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید

فایل‌های ضمیمه را هم از لینک زیر دریافت کنید:
[ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ]
S.hoiseinpoor
31-01-2012, 19:39
خیلی خوب بود
ولی بازم مشکل همیشگی عدم ساپورت...:41:
بنظرت باید چیکار کرد؟ یا چه روشی برای دور زدن این مشکلات هست؟
David.Jn
31-01-2012, 20:57
راستی اینرو هم میتونید برای IE‌ اضافه کنید که تو IE9‌ احتمالن جواب بده

برای مشاهده محتوا ، لطفا وارد شوید یا ثبت نام کنید
من خودم تست نکردم (IE9‌ندارم)ولی این سینتکس به احتمال زیاد تو IE9‌ جواب میده



خیلی خوب بود
ولی بازم مشکل همیشگی عدم ساپورت...:41:
بنظرت باید چیکار کرد؟ یا چه روشی برای دور زدن این مشکلات هست؟

میتونید از روش‌های قدیمی برای اینکار استفاده کنید
عکس به اینصورت که شما برای بردرهای کناری یک عکس را داخل یک دیو قرار می‌دهید و در راستای Y ریپیت میزنید و دو عکس هم برای بردر بالا و پایین