قالب وردپرس پوسته وردپرس قالب فروشگاهی وردپس
خانه / آموزش html / طراح بندی های صفحات مختلف html

طراح بندی های صفحات مختلف html

یکی از مهمترین و اصلی ترین مباحث در آموزش HTML ، فراگیری نحوه ایجاد لایه ها با HTML است.در HTML ، با استفاده از تگ های مختلفی می توان صفحه را لایه بندی نمود.یکی از مهمترین تگ ها برای اینکار ،استفاده از تگ div ایست.این تگ در HTML دقیقا نقش دیوارهای یک ساختمان واقعی را دارد.در HTML ، بوسیله تگ DIV می توان ،مرزبندری بین بخش های مختلف را طرح کرد.

لایه بندی صفحات HTML با تگ div

هماهنگونه که مطرح شد،لایه بندی با استفاده از تگ div عموما صورت می گیرد.

<div id="header">
<h1>All Cities</h1>
</div>

<div id="navbar">
city1<br>
city2<br>
city3
</div>

در مثال بالا، سفحه HTML به دو بخش لایه بندی شده است،بخش سربرگ صفحه HTML و دوم بخشی برای نمایش نوار منوی صفحه HTML . آیا تگ div عرض خاصی دارد؟ ممکن است این سوال را بپرسید که تگ DIV در لایه بندی های HTML ،چه عرضی دارد؟ آیا عرض به صورت خودکار تنظیم می شود؟پاسخ به این سوال اینست که تگ های DIV در صفحات HTML ، جزء آن دسته ای عناصری محسوب می شوند که Display از نوع Block دارند.به عبارت دیگر Block-display هستند،بدین معنا که تمام عنصر والد خود را در HTML فرا می گیرند.به عبارت دیگر، یک سطر را به صورت کامل دربرمی گیرند.پس اگر در یک صفحه HTML ، دو تگ DIV داشته باشیم ، ان ها در یک ردیف قرار نخواهند گرفت ، بله تگ های DIV در دو سطر زیر هم در صفحه HTML قرار می گیرند.

آموزش HTML و طراحی لایه HTML

آیا ا ز سایر عنصر HTML می توان استفاده کرد؟ پاسخ اینست که رایج ترین عنصر در HTML برای لایه بندی و قالب بندی صفحات، همین تگ DIV است ، با این وجود گاها از سایر تگ ها نیز می توان کمک گرفت.به فرض مثال از تگ nav می توان برای ایجاد نوار منو در HTML استفاده نمود.پس بنابراین، تنها تگ HTML برای لایه بندی ، تگ DIV نمی باشد.به فرض مثال، می توان برای ایجاد فوتر صفحه HTML ، از تگ footer هم استفاده کرد. لایه بندی با استفاده از جداول: در سند HTML می توان با استفاده از table هم لایه بندی را انجام داد.اما استفاده از table برای ایجاد قالب بندی، روز به روز منسوخ می شود ،چرا که در HTML ، بهترین شیوه طرح بندی،همان تگ DIV می باشد.مهمترین مزیت استفاده از تگ های DIV و … به جای Table در HTML ، اینست که سرعت لود را بالاتر می برد و دوم اینکه به استاندارد نیز نزدیکتر است. این مبحث جزء مباحث مهم در آموزش جامع HTML می باشد.جهت مشاهده مقالات آموزش ASP.NET کلیک کنید.

 

سايت بزرگ کليک سايت،بهترين مرجع در ضمينه آموزش طراحي سايت و آموزش html و آموزش css ميباشد.تمامي فيلم هاي آموزشي اين سايت توسط استادان کاردان و بسيار با تجربه تهيه شده که تضميني بر کيفيت بالاي تمامي آن ها است.قيمت محصولات نيز کاملا رقابتي بوده و با مقايسه آن با ساير سايت ها ميتوان به خوبي متوجه اين موضوع شد.

درباره ی admin

مطلب پیشنهادی

عناصر های مختلف html

در زبان HTML و صفحات وب چند نوع تگ داریم.از حیث انواع display ها می …

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

قالب وردپرس پوسته وردپرس قالب فروشگاهی وردپس