masoud_21
جمعه 01 شهریور 1392, 22:51 عصر
خوب او توضیح کدها:
همیشه من برای طراحی سایت هام یه دایو اصلی که همان دایو با کلاس main هست رو میزارم که دقیقا مثل body هست. یعنی کل صفحه رو پوشش میده.
دایو دوم که با کلاس wrapper هست برای قرار دادن content سایتمون استفاده میشه و با استایلی که بهش میدیم وسط صفحه قرار میگیره با دادن margin:0 auto;. کدهای دیگشم که معلوم کارشون چیه.
برای اینکه بخوای سه تا یا هر چند تا دایو رو توی یه دایو دیگه بزاری و پشت سر هم بیان باید چند تا کار انجام بدی یکی ایکه باید مجموع اندازه پهنای یعنی width اون چند تا دایو از اندازه دایو اصلی کمتر باشن، بعد position دایو اصلی و دایوهای فرزند باید relative باشه، و همچنین float هر کدام از دایو های فرزند باید برابر باشه مثلا right اگه مطلب برات گنگ بود یه مثال میزنم که امیدوارم مطلب رو کامل هم درک کنی هم اینکه بتونی بعدا هرجا خواستی استفاده کنی.
مثال:
<div class="parent">
<div class="child"></div>
<div class="child"></div>
<div class="child"></div>
<div class="child"></div>
</div>
اینم کلاس هاش به اندازه پهنای هر دو کلاس دقت کن:
.parent{
position: relative;
width: 980px;
height: 150px;
background-color: red;
}
.child{
position: relative;
width: 235px;
height: 100px;
margin-left: 10px;
float: right;
background-color: yellow;
}