با سلام و آرزوی خسته نباشید مجدد خدمت کاربران مشتاق سایت پگاسوس گراف.
امروز با جلسه دوم آموزش صفر تا صد html در خدمت شما عزیزان میباشم.
موضوعی که امروز به آن خواهیم پرداخت آشنایی با پاراگراف و چگونگی نمایش انواع آن خواهد بود.

جهت تست کدهای مورد نظر می توانید آنهارا در نوت پد تحت عنوان index.html و فرمت utf-8 ذخیره کنید و یا می توانید با ادیتور آنلاین پگاسوس گراف با آدرس pegasusgraph.ir/online-editor استفاده کنید.

»» پاراگراف ها در HTML :

عنصر p در HTML یک پاراگراف را تعریف میکند.
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

نکته  : مرورگر ها به صورت خودکار مقداری فضای خالی (margin) قبل و بعد از عنصر پاراگراف اضافه میکنند.

»» چگونگی نمایش صفحات HTML  :
بسته به اینکه صفحه ی شما در صفحه نمایش های کوچک و یا بزرگ نمایش داده شود ممکن است نتایج مختلفی ایجاد کند.
پس نمیتوانید همیشه در مورد چگونگی نمایش صفحاتتان مطمئن باشید.
در HTML با اضافه کردن فضاهای خالی بیشتر و یا افزودن بیشتر خطوط جدید نمیتوان نوع نمایش صفحه را در خروجی تغییر داد.
به عبارتی دیگر مرورگر ها فضای های خالی بیشتر و همین طور خطوط جدید را در نمایش صفحه نادیده میگیرند.
 برای مشخص شدن موضوع به مثال زیر دقت کنید :
<p>
This paragraph
contains a lot of lines
in the source code,
but the browser 
ignores it.
</p>

<p>
This paragraph
contains         a lot of spaces
in the source         code,
but the        browser 
ignores it.
</p>

در نمونه کد بالا در پاراگراف اول یک خط به چندین خط شکسته شده است اما مرورگر چنین پاراگرافی را در یک خط نمایش میدهد.
 در پاراگراف دوم از فضاهای خالی بیشتری در بین کلمات استفاده شده است که این هم به وسیله مرورگر نادیده گرفته خواهد شد.

»» عنصر خط جدید در HTML   :
عنصر br در HTML باعث ایجاد یک خط جدید در صفحه میشود.
در صورتی که نمیخواهید یک پاراگراف جدید ایجاد کنید و نیاز به یک خط جدید در همان پاراگراف دارید از عنصر br استفاده کنید :
<p>This is<br>a paragraph<br>with line breaks.</p>

نکته : عنصر br از نوع عناصر empty بوده و فاقد تگ پایانی است.

»» مشکل نمایش چندین بیت شعر در HTML   :
با مشاهده ی خروجی کد زیر خواهید دید که بیت های شعر پشت سر هم نمایش میابند :
<p>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</p>

برای حل این مشکل باید از عنصری به نام pre در HTML استفاده کنیم.

»» عنصر pre در HTML   :
عنصر pre متنی که از قبل دارای فرمت هست را در خود جای میدهد و شکل آن را حفظ میکند. 
متون داخل تگ pre معمولا با فونت Courier نمایش داده شده و در این تگ فضا های خالی و خطوط جدید حفظ میشوند :
<pre>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</pre>

»» پـــایـــانــــ جــــلسهـــ ســــومـــــ آمــــوزشـــــ HTML   :