بخش اول آموزش html

[8908190]

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

بلاک ها در html  :

تمام عناصر HTML را می توان به دو دسته طبقه بندی کرد:

 (الف) بلوک ها (blocks)
 (ب) عناصر درون خطی (یا عناصر inline)

بلاک ها :

بلاک ها در html  بر روی صفحه نمایش ظاهر می شوند به صورت تمام عرض ادامه می یابد . به عنوان مثال
<p>، <h1>، <h2>، <h3>، <h4>، <h5>، <h6>، <ul>، <ol>، <dl>، <pre>، <hr />، <blockquote>، و <address>
همگی جزو بلاک ها دسته بندی می شوند . همه تگ های یاد شده از خط جدید  شروع می کنند، و هر چیزی که آنها را دنبال کند از خط جدید شروع میکند.
عناصر بلاک ها همیشه از یک خط جدید شروع می شوند.
به زبان ساده تر عناصری که یک خط را به صورت کامل اشغال می کنند Block می گوییم ؛ چه داخل عنصر محتوا بصورت کامل قرار بگیره چه در حد چند کلمه ی کوتاه باشد ، در هر صورت یک خط رو به صورت کامل در بر میگیرد و محتوای عنصر بعدی به خط بعد منتقل میشود .

 Inline عناصر

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

از سوی دیگر، عناصر درونی می توانند در جملات ظاهر شوند و مجبور به ظاهر شدن در خط جدید نیستند. این عناصر از جایی که شروع شده اند و تا جایی که پایان می بایند ادامه دارند. 
<i>، <u>، <em>، <strong>، <sup>، <sub>، <big>، <small>، <li>، <ins>، <del>، <cite>، <dfn>، <kbd>، و <var>
عناصر فوق همگی عناصر درون خطی هستند.

 گروه بندی عناصر در  HTML

دو تگ مهم وجود دارد که ما اغلب برای گروه بندی تگ های HTML از آن استفاده میکنیم: 
- تگ span
تگ div           


چه تفاوتی بین تگ <span> و <div> وجود دارد ؟

سوالی که اکثرا برای دانش آموختگان زبان html پیش می آید این است که چه تفاوتی بین div و span وجود دارد ؟
تفاوت بین تگ span و تگ div این است که تگ <span> با عناصر inline استفاده می شود در حالی که تگ div با عناصر بلوک مورد استفاده قرار می گیرد.




































------------------

منبع:
آموزش HTML از 0 تا 100 طراحی قالب حرفه ای جهت ورود به بازر کار