repeat نشدن عکس داخل div

واضح آرشیو وب فارسی:سایت ریسک: View Full Version : repeat نشدن عکس داخل div zibatarin nam13-09-2008, 02:05 AMسلام به همه آقا من یه div زدم که یه عکس توش به صورت عمودی repeat میشه. این repeat شدن تا وقتی که ارتفاع div رو تعیین میکنی جواب میده. حالا مشکل از کجا شروع میشه: من اومدم بغل این div یهdiv دیگه زدم که محتواش text ه حالا وقتی متن از ارتفاع div بغلی بیشتر میشه div بغلی جا میمونه و اینم منطقیه چون ارتفاعش تا اونجا قد میده. اومدم ارتفاعش را auto تنظیم کردم ولی این دفعه اصلآ repeat نشد. حالا من میخوام ارتفاع این div (اونی که توش عکس قرار داره) رو طوری تنظیم کنم که همراه با اون div(اونی که متن توشه ) repeat بشه. فقط خواهشآ دنبال نخود سیاه نفرستید. as1385136513-09-2008, 10:14 AMشما دو تا Div دارید که می خواهید با هم به صورت موازی حرکت کنند ! چرا از یک DIV استفاده نمی کنید ؟ شما می تونید در یک قسمت DIV عکس رو نشون بدی و در قسمت دیگه متن رو ! این جوری خیلی ساده است ! فکر کنم اینجوری مشکل شما حل می شه ! ( هم متن و هم عکس رو با هم نشون بده ) zibatarin nam13-09-2008, 11:29 AMشما می تونید در یک قسمت DIV عکس رو نشون بدی و در قسمت دیگه متن رو ! این جوری خیلی ساده است ! فکر کنم اینجوری مشکل شما حل می شه ! ( هم متن و هم عکس رو با هم نشون بده ) آره دیشب خودم همین روش به فکرم رسید ولی این تا زمانی جواب میده که یدونه عکس بخواد نمایش داده بشه . من میخوام اینجوری بشه که سمت چپ متن یه عکس repeat بشه و سمت راست هم یکی دیگه. mohan2113-09-2008, 06:17 PMاز repeat-y بعد از آدرس تصویر استفاده کنید باید جواب بده .... ----------------------------------- محان neopersia13-09-2008, 07:09 PMآره دیشب خودم همین روش به فکرم رسید ولی این تا زمانی جواب میده که یدونه عکس بخواد نمایش داده بشه . من میخوام اینجوری بشه که سمت چپ متن یه عکس repeat بشه و سمت راست هم یکی دیگه. ببین این مدلی به کارت میاد: <div style="background:#FFFF99 url(bg.png) top right repeat; border:1px red solid"> <div style="float:right; width:199px;"> <p>محتویات قسمت کناری</p> </div> <div style="margin-right:200px; background:#f0f0f0 url(bg2.png) top right repeat; border:1px blue dashed"> <p>محتویات قسمت اصلی</p> </div> </div> zibatarin nam13-09-2008, 08:09 PMببین این مدلی به کارت میاد: ممنون ولی نه به کارم نیومد. انگار درست متوجه نشدید یه توضیح کامل میدم ه متوجه بشید من دنبال چی هستم. ببینید من 2 تا عکس دارم که به صورت عمودین و نقش border رو برای یک متن بازی میکنن حالا من اومدم هر کدوم از اینارو گزاشتم تو یه div یعنی یه div وسط که متن توش قرار میگیره و دوتای دیگه چپ و راستش که این عکس ها توش قرار میگیره. دفعه اول اومدم به این div های چپ و راستی ارتفاع تعیین کردم و عکس را توش repeat کردم این تا زمانی جواب میده که متن داخل div وسطی ارتفاعش هم اندازه اون دو تا div باشه ولی وقتی یکم بیشتر میشه دیگه اون div ها repeat نمیشه. حالا من میخوام جوری باشه که اندازه div های چپ و راستی داینامیک باشه و بر حسب div وسطی تغییر ارتفاع بده. دفعه دوم اومدم div وسطی را گزاشتم داخل همون div سمت راستی این روش خوب بود درست به اندازه متنrepeat میشد ولی دیگه سمت چپ دیگه border نداشتم . یعنی اومدم اون div سمت چپی را هم گزاشتم داخلش و اونو هم repeat کردم ولی هیچی نماش داده نشد . اینطور که معلوم شد تو یه div فقط یه div میتونه repeat بشه. فقط جان من زودتر جواب بدید ه بدجور گیرم. ali00h13-09-2008, 09:25 PMخوب دو تا عکسی که میخوای چپ و راست به عنوان border باشه و تکرار بشه رو یه تصویرش کن و تکرارش کن ( این وقتی میشه که طول div مشخص باشه) عرض div که متغیر ، نکنه طولشم میخوای متغیر باشه؟ milky way13-09-2008, 10:08 PMمیخوای از سایه استفاده بکنی ؟ neopersia14-09-2008, 01:08 AMاینو تست کن: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> .right-bg { background:url(right-border.png) top right repeat-y; } .left-bg { background:url(left-border.png) top left repeat-y; } .center-div { margin:0 10px; /* به اندازه عرض بوردر فاصله قرار بده */ background-color:#fff; /* برای اطمینان از اینکه تصویر بوردر زیر متن اصلی نمایش داده نشه */ } </style> </head> <body> <div class="right-bg"> <div class="left-bg"> <div class="center-div"> <p>متن اصلی</p> </div> </div> </div> </body> </html> pezhman3214-09-2008, 01:40 AMاگه خودت نمونه ی کدت رو بزاری بهتره تا بفهمیم دقیقا" چیه (البته من که زیاد وارد نیستم ولی کلا" میگم) ولی در این مواقع بد نیست از table استفاده کنی, چون از طرفی خیلی دقیق تره نسبت به div و از طرفی هم div ها ممکنه در مرورگرهای مختلف 1 جواب ندن (حتما" کدت رو تو چندتا مرورگر تست کن) zibatarin nam14-09-2008, 02:31 AMاینو تست کن: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> .right-bg { background:url(right-border.png) top right repeat-y; } .left-bg { background:url(left-border.png) top left repeat-y; } .center-div { margin:0 10px; /* به اندازه عرض بوردر فاصله قرار بده */ background-color:#fff; /* برای اطمینان از اینکه تصویر بوردر زیر متن اصلی نمایش داده نشه */ } </style> </head> <body> <div class="right-bg"> <div class="left-bg"> <div class="center-div"> <p>متن اصلی</p> </div> </div> </div> </body> </html> آخیش بالاخره یکی فهمید من دنبال چیم. ممنون این کد شبیه به اونچیزیه که خودم دفعه دوم نوشتم. شما خودت تست کردی جواب گرفتی؟ من تست کردم همون مشکل قبلی را دارم یعنی div چپی (بوردر چپی) اصلآ نمایش داده نمیشه تا چه برسه به تکرار شدنش . ولی یه چیزی تو خود dreamweaver نمایش میده یعنی هم بوردر چپی هم راستی نمایش داده میشه ضمنآ این دو تایی که نمایش داده میشه از هم خیلی فاصله دارن من به margin دست نزدم ولی paddin-right شو 10px دادم اگه خودت نمونه ی کدت رو بزاری بهتره تا بفهمیم دقیقا" چیه (البته من که زیاد وارد نیستم ولی کلا" میگم) ولی در این مواقع بد نیست از table استفاده کنی, چون از طرفی خیلی دقیق تره نسبت به div و از طرفی هم div ها ممکنه در مرورگرهای مختلف 1 جواب ندن (حتما" کدت رو تو چندتا مرورگر تست کن) کد همون چیزیه که neopersia گراشتن. آره تیبل ها دقیق هستند ولی تو دیر لود شدن صفحه تاثیر بسزایی دارن اما div برعکس. خداییش کار کردن با div یه مزه دیگه ای داره. خیلی حال میده . تا حالا که صفحه رو با div نوشتم و تو 3 تا مرورگر تست کردم حله حل بوده. pezhman3214-09-2008, 02:42 AMآخیش بالاخره یکی فهمید من دنبال چیم. ممنون این کد شبیه به اونچیزیه که خودم دفعه دوم نوشتم. شما خودت تست کردی جواب گرفتی؟ من تست کردم همون مشکل قبلی را دارم یعنی div چپی (بوردر چپی) اصلآ نمایش داده نمیشه تا چه برسه به تکرار شدنش . ولی یه چیزی تو خود dreamweaver نمایش میده یعنی هم بوردر چپی هم راستی نمایش داده میشه ضمنآ این دو تایی که نمایش داده میشه از هم خیلی فاصله دارن من به margin دست نزدم ولی paddin-right شو 10px دادم کد همون چیزیه که neopersia گراشتن. آره تیبل ها دقیق هستند ولی تو دیر لود شدن صفحه تاثیر بسزایی دارن اما div برعکس. خداییش کار کردن با div یه مزه دیگه ای داره. خیلی حال میده . تا حالا که صفحه رو با div نوشتم و تو 3 تا مرورگر تست کردم حله حل بوده. در مورد اینکه کارکردن با دیو یه مزه دیگه میده موافقم (!) اما چون محتوای داخلش رو کامل پوشش نمیده یکمی سخت میشه neopersia14-09-2008, 03:12 AMآخیش بالاخره یکی فهمید من دنبال چیم. ممنون این کد شبیه به اونچیزیه که خودم دفعه دوم نوشتم. شما خودت تست کردی جواب گرفتی؟ من تست کردم همون مشکل قبلی را دارم یعنی div چپی (بوردر چپی) اصلآ نمایش داده نمیشه تا چه برسه به تکرار شدنش . ولی یه چیزی تو خود dreamweaver نمایش میده یعنی هم بوردر چپی هم راستی نمایش داده میشه ضمنآ این دو تایی که نمایش داده میشه از هم خیلی فاصله دارن من به margin دست نزدم ولی paddin-right شو 10px دادم کد همون چیزیه که neopersia گراشتن. آره تیبل ها دقیق هستند ولی تو دیر لود شدن صفحه تاثیر بسزایی دارن اما div برعکس. خداییش کار کردن با div یه مزه دیگه ای داره. خیلی حال میده . تا حالا که صفحه رو با div نوشتم و تو 3 تا مرورگر تست کردم حله حل بوده. من دقیقاً از همین روش تو این استفاده کردم: !!!! برای مشاهده محتوا ، لطفا ثبت نام کنید / وارد شوید !!!! اگه همه چیز درست باشه مشکلی نداره. احتمالاً یه جا width یا padding دادی که تداخل پیدا کرده zibatarin nam14-09-2008, 01:40 PMببینید دوستان این اون چیزیه که تو dreamwever تو قسمت design ش نمایش داده میشه من دقیقآ همینو میخوام. http://freedomiran.persiangig.com/border.gif ولی تو مرورگر ها اون border آبی نمایش داده نمیشه. کد هم همون کدیه که neopersia زحمتشو کشیدن ولی به خاطر فاصله ای که میفتاد خودم یه تغییر دادم. کد به این صورت شد: <html> <style type="text/css"> .right-bg { float:right; background:url(right_border.gif) top right repeat-y; } .left-bg { float:left; background:url(left_border.gif)) top left repeat-y; } .center-div { margin:0 10px 0px 10px; background-color:#fff; width:50px; } </style> </head> <body> <div> <div class="right-bg"> <div class="left-bg"> <div class="center-div"> <p>Helo world</p> </div> </div> </div> </div> </body> </html> مشکل کجاست.؟ زدم به سیم آخر شیطونه میگه برو دنبال table . میترسم برم دنبال اونم بازم همون آش و همون کاسه. neopersia14-09-2008, 09:37 PMاینو تست کردم کار میکنه: <style type="text/css"> .right-bg { background:url(right_border.gif) top right repeat-y; width:100px; } .left-bg { background:url(left_border.gif)) top left repeat-y; } .center-div { margin:0 10px 0px 10px; background-color:#fff; } </style> اگر برای div وسط بخوای عرض مشخص کنی میتونی اینجوری بهش margin بدی: width:50px; margin:0 auto استفاده از float هم درست نبود! سایت ما را در گوگل محبوب کنید با کلیک روی دکمه ای که در سمت چپ این منو با عنوان +1 قرار داده شده شما به این سایت مهر تأیید میزنید و به دوستانتان در صفحه جستجوی گوگل دیدن این سایت را پیشنهاد میکنید که این امر خود باعث افزایش رتبه سایت در گوگل میشود

این صفحه را در گوگل محبوب کنید

[ارسال شده از: سایت ریسک]

[مشاهده در: www.ri3k.eu]

[تعداد بازديد از اين مطلب: 238]