gtanori 10 ارسال شده در دی 91 گزارش بازنشر ارسال شده در دی 91 (ویرایش شده) سلام یه سوال من می خواهم الان یه قالب طراحی کنم با سی اس اس ولی خیلی اذیت می کنه مثلا برای ست شدن صفحه وسط روی منو چپ یا راست نیافته باید پیکسل پیسکل امتحان کنم left , top رو که روش نیافته راهی نیست به سرعت مثلا بیاد وسط باکساین کدم استمشکل دیگه که هست عکس پشت زمینه که دو جا گذاشتم کار نمی کنه و یه سوال دیگه چطور میشه منو که در بالای صفحه درست کردم وسط بیاد با تشکر <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR...l1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title></title> <style type="text/css"> body{ background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg); } #main{ border:2px solid #FF00FF ; width: 100%; height:900px; background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg); } #left { border:4px solid #33FF00; width:200px ; height: 800px; top:62px ; position: absolute; } #right{ border:4px solid #3333FF ; width: 200px; height:800px; position: absolute; right:2px; top:62px ; } #menu{ border:2px solid #FF3333 ; width: 100%; height: 50px; background-image: url() ; } .list{ list-style: none; float:right; left:200px; } .list li{ float: left; } .list a{ display: block; margin:5px; padding:3px; background-color:#FF0000; border:1px dotted #FF3300; text-decoration: none } #center{ border:2px solid #FF00FF ; width: 915px; height:800px; right:10px; left:208px; top: 62px ; position: relative; } </style></head><body> <div id="main"> <div class="menu"> <img src="Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (7).jpg" /> <ul class="list"> <li><a href="#">درباره ما</a></li> <li><a href="#">محصولات</a></li> <li><a href="#">تماس با ما</a></li> <li><a href="#">درباره ما</a></li> </ul> </div> <div id="left"> </div> <div id="right"></div> <div id="center"></div> </div></body></html> ویرایش شده دی 91 توسط Morteza نقل قول لینک به ارسال
imanfakhar 26231 ارسال شده در دی 91 گزارش بازنشر ارسال شده در دی 91 کدهاتون اینطوری قابل بررسی نیستچند نکته هست که پاسخ بدهید بهتر از این کدهاستposition لایه ها چقدر است شرایطی که برای تنظیم فرمودیدذ در سه مقدار relative و absolute و fixed تاثیر دارند (مقدار top و left) که لایه های اصلی نباید دو خاصیت absolute و fixed را داشته باشند و در حالت relative ابتدا لایه را باdisplay:blockیاdisplay:table;یک بلوک نمایید و بعد با استفاده از کد زیر به وسط صفحه انتقال دهیدmargin-left:auto;margin-right:auto;در مورد عکس پشت زمینه هم باید کدهای style.css بررسی بشه نه این کدها ولی بهتره اگر سایت آنلاینه آدرس بدید و در غیر اینصورت از صفحه اجراشده سورس کد تهیه کنید و داخل یک فایل txt برای بررسی بگذارید 2 نقل قول لینک به ارسال
mehral 785 ارسال شده در دی 91 گزارش بازنشر ارسال شده در دی 91 (ویرایش شده) این کدینگ با توجه به کدینگ خودته <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR...l1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title></title><style type="text/css">body{background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg);}#main{border:2px solid #FF00FF ;width: 100%;height:900px;background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg);}#menu{border:2px solid #FF3333 ;overflow: hidden;background: orange;width: 100%;height: 50px;background-image: url() ;}.list{list-style: none;float:right;left:200px;}.list li{float: left;}.list a{display: block;margin:5px;padding:3px;background-color:#FF0000;border:1px dotted #FF3300;text-decoration: none}.position {overflow: hidden;}#left {border:4px solid #33FF00;width:200px ;height: 800px;float: left;}#right{border:4px solid #3333FF ;width: 200px;height:800px;float: right;}#center{border: 2px solid #FF00FF;width: 900px;height: 800px;float: left;margin-left: 5px;}</style></head><body><div id="main"><div id="menu"> <img src="Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (7).jpg" /> <ul class="list"> <li><a href="#">درباره ما</a></li> <li><a href="#">محصولات</a></li> <li><a href="#">تماس با ما</a></li> <li><a href="#">درباره ما</a></li> </ul></div><div class="position"> <div id="left"></div> <div id="center"></div> <div id="right"></div></div></div></body></html> ویرایش شده دی 91 توسط Morteza 1 نقل قول لینک به ارسال
gtanori 10 ارسال شده در دی 91 مالک گزارش بازنشر ارسال شده در دی 91 کدهاتون اینطوری قابل بررسی نیست چند نکته هست که پاسخ بدهید بهتر از این کدهاست position لایه ها چقدر است شرایطی که برای تنظیم فرمودیدذ در سه مقدار relative و absolute و fixed تاثیر دارند (مقدار top و left) که لایه های اصلی نباید دو خاصیت absolute و fixed را داشته باشند و در حالت relative ابتدا لایه را با display:block یا display:table; یک بلوک نمایید و بعد با استفاده از کد زیر به وسط صفحه انتقال دهید margin-left:auto; margin-right:auto; در مورد عکس پشت زمینه هم باید کدهای style.css بررسی بشه نه این کدها ولی بهتره اگر سایت آنلاینه آدرس بدید و در غیر اینصورت از صفحه اجراشده سورس کد تهیه کنید و داخل یک فایل txt برای بررسی بگذارید سلام با تشکر از توضیحاتون من برای پروه دانشگاه که طراحی سایت رو خواستند دارم کار می کنم مشکل وسط حل شد با کدهاتون مرسییه سوالی که داشتم اینه که منو بالا که ساختم برای رفتن به خانه و غیره رو چطور میشه وسط آورد و عکس پشت زمینه اش رو عوض کردم میدونم با بک گراند ایمج است ولی هر چی میزارم کار نمی کنهراستی میشه یه کم در مورد postion و خاصیت هاش بگید چون الان مشکلی که برا م پیش اومد بخاطر همون بودproject.htm نقل قول لینک به ارسال
imanfakhar 26231 ارسال شده در دی 91 گزارش بازنشر ارسال شده در دی 91 راستی میشه یه کم در مورد postion و خاصیت هاش بگید چون الان مشکلی که برا م پیش اومد بخاطر همون بودpostion همونطور که از اسمش بر می آد پز لایه را در صفحه ایجاد می کند و مقادیر پز های اصلی عبارتند ازstatic:مقدار پیش فرض اکثر لایه هاست و چون نمایشگر هر لایه ای را به طور طبیعی در این حالت می بیند خیلی در کد نویسی کارایی ندارد ولی به لحاظ شکلی یعنی لایه ها مانند کلمه های یک نوشته در ادامه همنندabsolute:در این حالت لایه ها در واقع از بعد سوم هم پشتیبانی می کنند و می توانند مانند دو کاغذ روی هم قرار گیرند یا در هر مختصاتی که بهشون داده می شه اما خاصیت استاتیکی ندارند و نباید در لایه های مادر قرار بگیرند چون بعضی از نمایشگرها با اسکرول و حتی مختصات آنها نا سازگارند و در ضمن مختصات در مونیتورهای مختلف متفاوت است رزولیشن مونیتور و واید اسکرین بودن یا نبودنش به طور مستقیم در این پز موثرند در نتیجه طراح نمی تواند ترسیمی یک دست داشته باشدfixed:مانند لایه قبل اما کل فضای قابل مشاهده ابعاد مونیتور است (اسکرول نمی شود) و محلش همیشه در صفحه ثابت استو اگر صفحه ما اسکرول شود این لایه در موقعیت خود نسبت به مونیتور باقی می ماندrelative:این پز مانند پز ایستاتیک عمل می کند ولی از پارامترهای دو پز دیگر هم پشتیبانی می کند در حالت پز ابسولوت اگر لایه را داخل یک لایه با این پز بگذاریم مختصات خوانده شده را بر اساس موقعیت این لایه می خواند نه بر اساس صفحهمثالفرض کنید یک نوار ابزار می خواهید در بالای صفحه داشته باشید که همیشه در جای خود ثابت باشد و در آن یک لایه ul دارید و چند li که بعضی از li دارای زیر مجموعه هایی هستند که می خواهید در صورت حرکت موس روی آنها باز شند و باز و بسته شدنشان آسیبی به طراحی مابقی صفحه سایت نزند در این حالت لایه اصلی را fixed در نظر می گیرید و li های دارای زیر مجموعه را relative و لایه های کشویی را absolute و نتیجه ای مشابه کد زیر خواهید داشتکد را در برگه نوت پد با پسوند html ذخیره کنید و از طریق نمایشگر باز کنیدpos-test.zip 2 نقل قول لینک به ارسال
imanfakhar 26231 ارسال شده در دی 91 گزارش بازنشر ارسال شده در دی 91 استایل بندی فایلی که پیوست بودید را با حذف پزیشن ها و اضافه کردن دو خاصیتdisplay:inline-block;*/block;inline,table,...*/float:left;*/right,none*/ترمیم کنیدمقادیر داخل */... */ مقدارهای دیگری هستند که می توانید قرار دهید و تست کنید 2 نقل قول لینک به ارسال
پست های پیشنهاد شده
به گفتگو بپیوندید
هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .