عنصرهای Block و Inline

Main Page Tutorial
موارد آموزشی
۱	خانه
۲	مقدمه
۳	ویرایشگرها
۴	پایه
۵	عنصرها
۶	ویژگی‌ها
۷	عنوان‌ها
۸	پاراگراف‌ها
۹	استایل‌ها
۱۰	قالب‌بندی
۱۱	نقل‌قول‌ها
۱۲	توضیحات
۱۳	رنگ‌ها RGB HEX HSL
۱۴	CSS
۱۵	لینک‌ها رنگ‌های لینک نشانک‌های لینک
۱۶	تصاویر نقشه‌های تصویری تصاویر پس‌زمینه عنصر Picture
۱۷	جداول
۱۸	لیست‌ها لیست نامرتب لیست مرتب لیست‌های دیگر
۱۹	بلوک‌ها
۲۰	کلاس‌ها
۲۱	شناسه
۲۲	Iframeها
۲۳	جاوا اسکریپت
۲۴	مسیرهای فایل
۲۵	سرصفحه
۲۶	چیدمان‌ها
۲۷	واکنش‌گرا
۲۸	کد کامپیوتری
۲۹	معنایی‌ها
۳۰	راهنمای استایل
۳۱	موجودیت‌ها
۳۲	نماد‌ها
۳۳	ایموجی‌ها
۳۴	مجموعه کاراکترها
۳۵	رمزگذاری URL
۳۶	HTML و XHTML
فرم‌های HTML
گرافیک در HTML
رسانه در HTML
APIها در HTML
مثال‌ها
مرجع HTML

هر عنصر یک مقدار نمایش پیش فرض براساس به نوع عنصر دارد.

دو مقدار نمایش عبارتند از :block و inline.

عنصرهای سطح بلوک (به انگلیسی: Block-level)

یک عنصر سطح بلاک همیشه در یک خط جدید شروع می‌شود و کل عرض موجود را اشغال می‌کند (به سمت چپ و راست تا جایی که می‌تواند کِش می‌آید).

عنصر <div> یک عنصر سطح بلوک است.

مثال

<div>Hello World</div>

مشاهدهٔ نتیجه

عنصرهای سطح بلوک در HTML:

<address> • <article> • <aside> • <blockquote> • <canvas> • <dd> • <div> • <dl> • <dt> • <fieldset> • <figcaption> • <figure> • <footer> • <form> • <h1>-<h6> • <header> • <hr> • <li> • <main> • <nav> • <noscript> • <ol> • <p> • <pre> • <section> • <table> • <tfoot> • <ul> • <video>

عنصرهای درون خطی (به انگلیسی: Inline)

یک عنصر درون خطی در خط جدید شروع نمی‌شود و فقط به اندازه نیاز عرض صفحه را اشغال می‌کند.

این یک عنصر درون خطی <span> داخل یک پاراگراف است.

مثال

<span>Hello World</span>

مشاهدهٔ نتیجه

عنصرهای درون خطی در HTML:

<a> • <abbr> • <acronym> • <b> • <bdo> • <big> • <br> • <button> • <cite> • <code> • <dfn> • <em> • <i> • <img> • <input> • <kbd> • <label> • <map> • <object> • <output> • <q> • <samp> • <script> • <select> • <small> • <span> • <strong> • <sub> • <sup> • <textarea> • <time> • <tt> • <var> •

عنصر <div>

عنصر <div> اغلب بعنوان یک ظرف (به انگلیسی: Container) برای عنصرهای HTML دیگر استفاده می‌شود.

عنصر <div> هیچ ویژگی مورد نیازی ندارد اما style, class و id ویژگی‌های متداول هستند.

زمانی که <div> و CSS با باهم استفاده شوند می‌تواند برای استایل‌دهی به بلاک‌های محتوا استفاده شود:

مثال

1 <div style="background-color:black;color:white;padding:20px;">
2   <h2>London</h2>
3   <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
4 </div>

مشاهدهٔ نتیجه

عنصر <span>

عنصر <span> اغلب بعنوان ظرف برای متن استفاده می‌شود.

عنصر <span>هیچ ویژگی مورد نیازی ندارد اما style, class و id ویژگی‌های متداول هستند.

زمانی که <span> و CSS با باهم استفاده شوند می‌تواند برای استایل‌دهی به بخش‌هایی از محتوا استفاده شود:

مثال

<h1>My <span style="color:red">Important</span> Heading</h1>

مشاهدهٔ نتیجه

تگ های گروه بندی HTML

تگ	توصیف
<div>	یک بخش در سند را مشخص می‌کند (سطح بلوک)
<span>	یک بخش در سند را مشخص می‌کند (درون خطی)

برای دستیابی به لینک کامل همهٔ تگ‌های HTML، از مرجع تگ HTML ما بازدید کنید.

صفحهٔ بعد»

«صفحهٔ قبل