بلوک در HTML

بلوک های HTML

المان های HTML میتوانند به صورت گروه در تگ های div یا span قرار بگیرند. این المان ها به صورت بلوک های HTML ای یا المان های درون خطی(inline ) تعریف شده اند.

المان ها به صورت بلوک در HTML

المان هایی که به صورت بلوک هستند در هنگام نمایش در مرورگر ها شروع ( پایان) آن ها در یک خط است. یعنی مرورگر برای آن ها یک خط کامل را در نظر میگیرد اجازه ورود دیگر بخش های HTML را به آن بخش نمی دهد. درواقع display آنها  block است.

اگر با اندکی آشنا باشید میتوانید این موضوع را در کد ها css به سادگی مشاهده کنید. میتوانیم برخی از تگ ها که به طور پیش فرض این نوع نمایش را دارا هستند را نام ببریم: تگ h1، تگ p، تگ ul ، تگ table

المان های درون خطی در HTML

این المان ها لزوما  شروعشان در یک خط اتفاق نمی افتد و مرورگر ها میتوانند آنها را میان خط یا در راستای خطی دیگر نمایش بدهد.

برای این نوع المان ها نیز در صورت آشنایی با css میتوانید مشاهده کنید که صورت پیش فرض display انها به صورت inline نوشته شده است. مگر اینکه خودتان نوع نمایش آن تگ را تغییر دهید

المان ها درون تگ div

تگ div، تگی برای گروه کردن المان های بلوک در HTML است. این تگ به صورت خاص معنای خاصی ندارد. تنها می توانیم هنگامی که با CSS استفاده شود، میتوانید به محتوای زیادی را درون این بخش استایل اختصاص دهید .همچنین مرورگرها به صورت پیش فرض قبل و بعد از خط تگ div فاصله معینی را در نظر میگیرد.

از روش های معمول استفاده از تگ div، استفاده در ظاهر سند است. این روش جایگزین روش های قدیمی ایجاد ظاهر سند است که با استفاده از تگ table ایجاد می شده است.

المان های درون تگ span

تگ span تگی برای المان های درون خطی است که میتواند یک متنی را درون خود جای دهد. این تگ نیز مانند تگ div معنای خاصی ندارد وهنگامی که با CSS استفاده شود میتوانید به آن استایل دهید

8 نظرات شما

  • حسن

    اردیبهشت ۱۱, ۱۳۹۳ at ۸:۱۳ ق.ظ
    سلام بنده بیشتر در زمینه طراحی کار می کنم و کدنویسی هم تا حدودی آشنایی دارم لطفا از سایت من بازدید کنید همه کاراشو خودم انجام دادم لطفا با مرورگرهای مختلف ببینید اگر مشکلی مشاهده کردید به من بگین البته به گرافیک سایت شما نمی رسه...... سپاس
    • بهاران بنی اسدی

      خرداد ۲۶, ۱۳۹۳ at ۶:۳۰ ب.ظ
      بنظرم خیلی تمیزه و خوبه فقط توی بعضی صفحات انگار فونت ها درست نمایش داده نمیشه. اگر از فونت استاندارد استفاده کنی همچین مشکلی نخواهی داشت.
  • Alireza Madadi

    اردیبهشت ۱۲, ۱۳۹۳ at ۷:۲۱ ب.ظ
    با سلام خانم بهاران بنی اسدی وب سایت شما بسیار عالیست اما مشکلی اساسی که شاید به چشم نیاید . این سایت هیچ جایی را ندارد تا اگر کسی خواست ارتباطی مستقیم داشته باشد بتواند مطلب خود را بنویسد یعنی همان "ارتباط با ما" که مطلب آن مستقیما به صاحب وب برسد (این رو به عنوان یک طراح سایت می گم) من هم مجبور شدم زیر این پست برای شما این مطلب رو بنویسم علیرضا مددی
    • بهاران بنی اسدی

      اردیبهشت ۱۳, ۱۳۹۳ at ۹:۲۱ ق.ظ
      سلام دوست عزیز ممنون از انتقادتون. این بخش رو به سایت اضافه کردم
  • علیرضا

    اردیبهشت ۱۲, ۱۳۹۳ at ۷:۴۰ ب.ظ
    سایت شمابهترین سایتی است که من درعمرم دیده ام لطفا اموزش ساخت سایت هم درمطالب خود بگذارید ازشماوسایت خوبتان متشکرم.
  • motaham

    شهریور ۸, ۱۳۹۳ at ۱۲:۳۳ ب.ظ
    با سلام ...... یه سوال؟ آموزش ها کار خودتونه یا نه از جایی کپی می کنید؟ و اینکه لطفا آموزش JavaScript هم بزارید. ممنون
  • محمد جواد

    تیر ۲۹, ۱۳۹۴ at ۱۲:۲۷ ب.ظ
    salam چجوری زبانشو فارسی کنم از متا تگ هم استفاده کردم ولی عمل نکردده.لطفا جوابشو ایمیل کنید خواهش میکنم جواب بدبید گیر کردم.
    • الهه قنبری

      تیر ۲۹, ۱۳۹۴ at ۲:۴۴ ب.ظ
      سلام اگر منظورتان راست چین کردن کدها است باید با استایل دهی توسط css این کار را انجام دهید.

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *


© 2013 Mobtadi. All rights reserved.
کلیه حقوق مادی و معنوی برای وبسایت مبتدی محفوظ است.