ارز دیجیتال
تگ DIV در طراحی سایت چیست؟
تگ div در html و طراحی سایت یکی از تگ های کاربردی می باشد که می توانیم با آن صفحه را به بخش های مختلف تقسیم کنیم. تگ دایو یا دیو مانند یک ظرف است که می توانیم هر چیزی داخل آن بریزیم. در این نوشته استفاده از تگ div در html به صورت اصولی آموزش داده می شود تا بتوانید به بهترین نحو آن را به کار ببرید.
تگ Div در HTML:
تگ div یا دایو یا دیو که از کلمه ( Division ) گرفته شده ، یکی از تگ های پرکاربرد در طراحی صفحات وب می باشد که با استفاده از آن میتوان یک یا چندین بخش را در یک صفحه ی وب ایجاد کرد. بطور کلی اینو بدونید که تگ div مثه یه ظرف ( Container ) میمونه برای نگهداری دیگر تگ ها، یعنی عملا هرچیزی رو میشه گذاشت داخل تگ div ، همین تموم شد رفت. کمی قبلتر که هنوز HTML اینقد پیشرفت نکرده بود، طراحان وب سایت برای طرح بندی ( یا همون بخش بندی وبسایت ) از جدول استفاده میکردند ، یعنی با استفاده از جدول میومدن و بخش های یک وبسایت رو مشخص میکردند. ( مثلا بخش هدر ، مطالب اصلی و فوتر و.. ) حال امروزه با وجود تگ Div دیگه اصلا نباید از جدول ها برای بخش بندی یک وبسایت استفاده کرد، چون هم تاثیر منفی در سئو داره و هم سایت ما از نظر مرورگرها و موتورهای جستجوگر یه سایت غیرحرفه ای می باشد. پس دیگه الانه با وجود تگ هایی مثه header ، footer ، div ، article و… ما به راحتی میتونیم بخش های مختلف یک صفحه رو طراحی کنیم و این طراحی ما میشه یه طراحی مدرن ، طراحی حرفه ای و مورد قبول مرورگرها و موتورهای جستجوگر برای بحث سئو.
مثال برای تگ div : کدهای html
در مثال زیر ما دو تا div در سند html تعریف کردیم یعنی دو بلوک ایجاد کردیم در هر بلوک محتوایی دلخواه قرار دادیم مثلا در بلوک اول تگ <p> و در بلوک دوم دو تگ <p> و <img> قرار دادیم. همانطور که گفتیم تگ div صرفا برای بلوک بندی و گروه بندی المان ها در سند html می باشد(در کدنویسی های پیشرفته چند بلاک یا div به صورت تو در تو تعریف می شود)
<!DOCTYPE html>
<html lang=”fa” dir=”rtl”>
<head>
<link href=”style.css” rel=”stylesheet”>
<meta charset=”utf-8″>
</head>
</body>
<div class=”a“>
<p> محتویات div اول </p>
</div>
<div class=”b“>
<p> محتویات div دوم </p>
<img src=”dpi.png” alt=”داژیار”>
</div>
</body>
</html>
نتیجه گیری:
در این مقاله در رابطه با تگ بلوکی div صحبت کردیم و با آن آشنا شدیم.
این تگ از سری تگ‌های پر استفاده و کاربردی HTML می‌باشد.
این تگ تفاوت‌های بسیاری با تگ span دارد.
این تگ دارای خاصیت‌های align و autofocus است که البته تگ align از HTML5 به بعد در این تگ پشتیبانی نمی‌شود.
اگر سوال، پیشنهاد ویا انتقادی در رابطه با این مقاله داشتید، می‌تونید با ما در بخش دیدگاه‌ها به اشتراک بگذارید، خوشحال میشم که نظرتون رو در رابطه با مقالات بدونم تا اگر خوبه انرژی بگیرم و اگر جایی نیازمند اصلاح داره حتما در مقالات اعمالش کنم.
بالا