02.03.2017 Views

CSS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

ایجاد طراح ‏)قالب(‏ های شناور دو ستونه<br />

برای ایجاد یک طرح دو ستونه ساده باید کار را از یک صفحه HTML شروع کنیم.‏ در صفحه<br />

مثالی که در ادامه برسی خواهیم کرد بخش های اصلی زیر وجود دارد.‏<br />

HTML<br />

:Content بخش محتوا که قرار است محتوای اصلی سایت در آن قرار بگیرد.‏<br />

:MainNav بخش پیمایش اصلی navigation( )main که قرار است در سمت چپ قرار<br />

<br />

<br />

گرفته و حاوی لینک ها و عناصر برای دسترسی ساده تر کاربر به صفحات دیگر سایت<br />

باشد.‏<br />

:Footer بخش پانویس که قرار است اطالعاتی اضافی از سایت را در آن قرار دهیم.‏<br />

<br />

هر کدام از این عناصر را با یک عنصر<br />

به کد زیر دقت کنید:‏<br />

در این مثال قرار است<br />

کنید چون بخش<br />

با نام Div<br />

wrapper<br />

Content<br />

به سمت راست و<br />

mainNav<br />

Content<br />

بیاید تا دسترسی و استفاده از آن نیز آسان تر باشد.‏<br />

حال به سراغ تعیین قواعد عناصر فوق در<br />

پوشانده شده اند.‏<br />

به سمت چپ بروند.‏ به این نکته دقت<br />

ما حاوی اطالعات مهمتر است کد آن نیز باید قبل از بخش<br />

mainNav<br />

<strong>CSS</strong><br />

میرویم.‏ ما از<br />

Selector<br />

برای هر بخش استفاده میکنیم.‏ ابتدا بصورت زیر برای هر یک از بخش های<br />

عرض تعیین کنیم:‏<br />

آموزش کاربردی <strong>CSS</strong>3<br />

<br />

<br />

…..<br />

<br />

<br />

…..<br />

<br />

<br />

…….<br />

<br />

<br />

نام برای تعریف قواعد<br />

Content و mainNav<br />

131<br />

‏”رسولی”‏ نویسنده:‏ فردوس

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!