عناصر و تکنیک های چیدمان HTML

وب سایت ها اغلب مطالب را در چندین ستون (مانند یک مجله یا روزنامه) نمایش می دهند.

 

ساخته شود ( https://www.w3schools.com/html/html_layout.asp )

 

 

عناصر چیدمان HTML

HTML دارای چندین عنصر معنایی است که قسمتهای مختلف یک صفحه وب را تعریف می کند:

  • <header> - سرصفحه یک سند یا یک بخش را تعریف می کند
  • <nav> - مجموعه ای از پیوندهای ناوبری را تعریف می کند
  • <section> - بخشی را در یک سند تعریف می کند
  • <article> - محتوای مستقل و مستقل را تعریف می کند
  • <aside> - محتوای جدا از محتوا را تعریف می کند (مانند نوار کناری)
  • <footer> - پانویس برای یک سند یا یک بخش را تعریف می کند
  • <details> - جزئیات بیشتری را تعریف می کند که کاربر می تواند در صورت تقاضا باز و بسته کند
  • <summary> - عنوانی را برای عنصر <جزئیات> تعریف می کند

 

 

تکنیک های چیدمان HTML

چهار روش مختلف برای ایجاد طرح بندی چند ستونی وجود دارد. هر تکنیک مزایا و معایب خود را دارد:

 

چارچوب های CSS

اگر می خواهید طرح خود را سریع ایجاد کنید ، می توانید از یک فریم ورک CSS مانند W3.CSS یا Bootstrap استفاده کنید.

 

چیدمان شناور CSS

معمولاً انجام کل طرح بندی وب با استفاده از خاصیت float CSS انجام می شود. یادگیری آن آسان است - فقط باید یاد بگیرید که چگونه شناور و خصوصیات واضح کار می کنند.

معایب: عناصر شناور به جریان سند متصل می شوند ، که ممکن است به انعطاف پذیری آسیب برساند.

 

طرح بندی CSS Flexbox

استفاده از flexbox تضمین می کند که عناصر هنگام پیش بینی صفحه باید دارای اندازه های مختلف صفحه نمایش و دستگاه های نمایش مختلف باشند، قابل پیش بینی هستند.

 

چیدمان شبکه CSS

ماژول طرح بندی شبکه GSS یک سیستم طرح بندی مبتنی بر شبکه ، با ردیف ها و ستون ها ارائه می دهد ، طراحی صفحات وب بدون استفاده از شناورها و موقعیت یابی را آسان می کند.