آموزش مقدماتی HTML5 | تگ‌های ساختاری در HTML
خطای دسترسی
برای ثبت پاسخ، ابتدا باید در سایت وارد شوید.
تگ <div> برای تقسیم بندی صفحه به بخش‌ها
تگ <div> یکی از تگ‌های اساسی و مهم در HTML است که برای تقسیم بندی و سازماندهی محتوا در یک صفحه وب استفاده می‌شود. این تگ به شما این امکان را می‌دهد که محتوای خود را به بخش‌های مختلف تقسیم کنید و هر بخش را به صورت جداگانه استایل‌دهی و مدیریت کنید.
ویژگی‌های تگ <div>
-
ساختاردهی: تگ
<div>به شما اجازه می‌دهد که عناصر مختلف را در یک گروه قرار دهید. این کار به شما کمک می‌کند که محتوای خود را به صورت منطقی و منظم سازماندهی کنید. مثلاً می‌توانید یک<div>برای نوار ناوبری، یک<div>برای محتوای اصلی و یک<div>برای پاورقی ایجاد کنید. -
استایل‌دهی: با استفاده از CSS، می‌توانید استایل‌های مختلفی را به تگ‌های
<div>اعمال کنید. این شامل رنگ پس‌زمینه، حاشیه، فاصله، عرض و ارتفاع و غیره می‌شود. با این کار، می‌توانید طراحی صفحه را بهبود دهید و جلوه بصری بهتری به آن ببخشید. -
قابلیت استفاده: تگ
<div>به عنوان یک عنصر بلاک (block element) عمل می‌کند، به این معنی که هر<div>یک خط جدید را شروع می‌کند و تمام عرض موجود را اشغال می‌کند. این ویژگی به شما این امکان را می‌دهد که بخش‌های مختلف صفحه را به راحتی در کنار یکدیگر قرار دهید.
مثال ساده از استفاده از تگ <div>
<!DOCTYPE html>
<html lang="fa">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>مثال تگ div</title>
<style>
.header {
background-color: #f1f1f1;
padding: 20px;
text-align: center;
}
.content {
margin: 20px;
padding: 20px;
background-color: #e2e2e2;
}
.footer {
background-color: #f1f1f1;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<div class="header">
<h1>عنوان وب‌سایت</h1>
</div>
<div class="content">
<p>این بخش محتوای اصلی وب‌سایت است.</p>
</div>
<div class="footer">
<p>پاورقی وب‌سایت</p>
</div>
</body>
</html>در این مثال، سه تگ <div> برای بخش‌های مختلف صفحه ایجاد شده است: یکی برای سرآغاز (header)، یکی برای محتوای اصلی (content) و یکی برای پاورقی (footer). با استفاده از CSS، استایل‌های مختلفی به هر بخش اعمال شده است که ظاهر صفحه را بهبود می‌بخشد.
تگ <div> ابزاری قدرتمند برای ساختاردهی وب‌سایت‌ها است و به طراحان وب کمک می‌کند تا محتوای خود را به صورت منظم و زیبا نمایش دهند.
برای ثبت پرسش ابتدا در سایت وارد شوید.