PDA

View Full Version : border این سایت



Arezoo62
پنج شنبه 08 تیر 1391, 12:59 عصر
دوستان border این سایت http://donbaleh.com که به شکلی سایه دار هستش به چه شکل درست شده؟ تو همه ی مرورگرها هم جواب میده

Mohsen.
پنج شنبه 08 تیر 1391, 13:53 عصر
با استفاده از دستور box-shadow در css

box-shadow:1px 2px 3px blue;

اندازه اول مربوط به راست یا چپ بودن سایه.
اندازه دوم مربوط به بالا یا پایین بودن سایه.
اندازه سوم مربوط به میزان پخش سایه.
آخری هم رنگ هست

Saber Mogaddas
پنج شنبه 08 تیر 1391, 14:18 عصر
سلام
توجه کنید که این سایت از دستور css box-shadowبرای shadow استفاده نکرده از یک تکه عکس که با background-repeat تکرار کرده این کار رو انجام داده این عکس (http://donbaleh.com/images/con_mid.png) رو در پس زمینه wraper محتوا قرار داده .. به همین دلیل تو تمامی مرورگر ها به درستی نمایش داده میشه :

background: url("images/con_mid.png") repeat-y scroll 0 0 transparent;

به repeat-y دقت کنید که به صورت عمودی تکرار شده این عکس.
موفق باشید..

Arezoo62
پنج شنبه 08 تیر 1391, 16:32 عصر
فقط آقای صابر این کد شما سمت چپ دایو قرار میگیره به چه شکل سمت راست سمت بالا و پایین رو هم بهش این خاصیت و بدم؟

Saber Mogaddas
پنج شنبه 08 تیر 1391, 19:47 عصر
سلام
نه این تصویر از هز دو طرف سایه خورده فقط توجه کنید که این تصویر دارای عرض ثابت هست و فقط تو اون عرض درست نمایش داده خواهد شد..برای انجام اینکار شما طرح کامل رو تو فتوشاپ تعبیه کنید و اون رو به سه قسمت تقیسم کنید (بالا ، وسط ، پایین) و از هر کدوم به صورت تک پیکسلی برش دهید و در نهایت اون تصاویر رو با دیو پیاده سازی کنید ، برای پیاده سازی دیو نیز دیو اصلی شامل 3 دیو خواهد بود که اولی سایه قسمت بالا و بعد پس زمینه وسط که از چپ و راست سایه دارند و در پایین نیز قسمتی برای پایین باکس قرار دهید..
موفق باشید..