ورود

View Full Version : چجوری بخش body رو به سه بخش تبدیل کنم


pclordweb
یک شنبه 20 اسفند 1391, 15:11 عصر
من میخوام تو بخش بادی یه سایدبار سمت راست یه سایت بار سمت چپ و در وسط هم محتویات یا کانتنت رو قرار بدم ، خوشحال میشم کمکم کنید. با float نمیشه درست جاشون نمی افتن یکی میره پایین یکی بالا
mehbod.rayaneh
یک شنبه 20 اسفند 1391, 16:12 عصر
سلام
هم 3 تا را float بدید!
بلوک راست ... float:right
بلوک وسط ... float:right; margin:auto
بلوک چپ ... float:left

بعدم شما ک اعتقادت اینه : یک برنامه نویس خوب هرگز کدی رو که بتونه کپی کنه خودش نمی نویسه
چرا زحمت میدی به خودت! برو کپی کن! :لبخند:
mmojbo
یک شنبه 20 اسفند 1391, 16:18 عصر
سلام دوست عزیز

این یه مثال ساده امیدوارم به درد بخوره.



<body>

<section>
<div></div>
<div id="content"></div>
<div></div>
</section>

</body>



body{
width: 80%;
background-color: #FF8000;
margin: 0 auto;
}
div{
float: left;
width: 20%;
background-color: olive;
height: 250px;
margin: 10px;
}
#content{
width: 50%;
}



موفق باشی
pary_daryayi
یک شنبه 20 اسفند 1391, 16:21 عصر
سلام .
منم دو تا مثال ساده تو بلاگم گذاشتم . امیدوارم مفید باشه:
http://blog.web-site-man.ir/%DA%86%D9%8A%D8%AF%D9%85%D8%A7%D9%86-div-%D8%A8%D8%B5%D9%88%D8%B1%D8%AA-%D8%A7%D9%81%D9%82%D9%8A-%D9%88-%D8%B9%D9%85%D9%88%D8%AF%D9%8A-%D8%AF%D8%B1-%D9%83%D9%86%D8%A7%D8%B1-%D9%87%D9%85/

و

http://blog.web-site-man.ir/%D8%A7%D9%8A%D8%AC%D8%A7%D8%AF-%D9%8A%D9%83-%D9%82%D8%A7%D9%84%D8%A8-%D8%B3%D8%A7%D8%AF%D9%87-%D8%A8%D8%A7-%D8%AF%D8%A7%D9%8A%D9%88/
pclordweb
یک شنبه 20 اسفند 1391, 19:52 عصر
من این کدارو میزنم دفعه اول که اجرا میشن درسته ولی وقتی کپیشونن میکنم اینجوری میشن :

101223

دستورات هم اینجوری هستن.

دستور Css


#main {
width:980px;
min-height:400px;
background-color:#FFFFFF;
margin:auto;
margin-top:72px;
border:solid 1px #d4d4d4;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
#sideright {
background-image:url(../Images/rightside.png);
height:49px;
float:right;
width:22%;
margin-top:15px;
}

#content {
background-image:url(../Images/contenthead.png);
height:41px;
float:right;
width:46.9%;
margin-top:15px;
margin-right:45px;
}

#sideleft {
background-image:url(../Images/leftside.png);
height:49px;
float:left;
width:22%;
margin-top:15px;

}




دستور html



<div id="main">
<section>
<div id="sideright"></div>
<div id="content"></div>
<div id="sideleft"></div>
<div id="sideright"></div>
<div id="content"></div>
<div id="sideleft"></div>
</section>

</div>
mehbod.rayaneh
یک شنبه 20 اسفند 1391, 20:25 عصر
درستش اینجوریه!


<div id="main">
<section>
<div id="sideright">
<div></div>
</div> <div id="content">
<div></div>
</div> <div id="sideleft">
<div></div>
</div>
</section>
</div>

اگه میخواید این تکرار بشه باید کلا div main را کپی کنید!
pclordweb
یک شنبه 20 اسفند 1391, 20:49 عصر
بنده در این مورد خیر Css رو زدم و با table به صورت کامل اصحیح و بدون مشکل انجام دادم و به Css هم زور گفتم :D
mokha21
یک شنبه 20 اسفند 1391, 20:52 عصر
بنده در این مورد خیر Css رو زدم و با table به صورت کامل اصحیح و بدون مشکل انجام دادم و به Css هم زور گفتم :D

دوست عزیز تگ table عمرش رو کرده الان دیگه کمتر سایتی رو میبنید که با table نوشته شده باشه.
mehbod.rayaneh
یک شنبه 20 اسفند 1391, 21:03 عصر
table less شنیدید شما؟! :لبخند:
روزگاریه اصن! :لبخند:
موفق باشید داداش! :تشویق:
pclordweb
یک شنبه 20 اسفند 1391, 21:31 عصر
table less شنیدید شما؟! :لبخند:
روزگاریه اصن! :لبخند:
موفق باشید داداش! :تشویق:

آقا تونستم ، تونستم ، تونستم . نوکرتم حاجی آقایی به مولا . بیخیال Table شدم به خاطر همون معایبش رفتم رو کد div کارکدم بالاخره تونستم.
mehbod.rayaneh
یک شنبه 20 اسفند 1391, 21:35 عصر
آفرین ... خواستن توانست است داداش :چشمک:
موفق باشی :تشویق: