دات نت نیوک
از سایت آموزشی وب جدید طراحی سایت همراه با امکان تست آنلاین کدهای html و css و js دیدن کنید. 
همراه با امکان خرید هاست و طراحی سایت دی ان ان و سایت فروشگاهی قابل توسعه!
پاراگراف ها در HTML

اسناد HTML با استفاده از تگ پاراگراف اقدام به جدا کردن مطالب داخل صفحه وب می کنند.


تگ p (پاراگراف)

برای ایجاد یک پاراگراف در HTML از تگ <p> استفاده می شود.

<p>یک یک پاراگراف است</p>
<p>این یک پاراگراف دیگر است</p>

خودتان آزمایش کنید »
Note مرورگرها برای جداسازی پاراگراف ها و تشخیص آنها از سایر المان های HTML به صورت خودکار یک خط خالی پیش و پس از متن داخل تگ های آغازین و پایانی آن نمایش می دهند.

HTML چگونه نمایش داده می شود؟

شما نمی توانید از چگونگی نمایش کدهای HTML خود توسط مرورگرها مطمئن باشید.

هنگامی که صفحه نمایش بازدید کننده بزرگ یا کوچک باشد و یا پنجره مرورگر در سایز های مختلفی تنظیم شود، شکل نمایش صفحات وب شما تغییر خواهد کرد.

با کم و زیاد کردن فضای خالی بین حروف (Space) نمی توانید فاصله بین حروف را در متنی که در کدهای HTML خود می نویسید کم و زیاد کنید.

مرورگر تمام فضاهای اضافه ایجاد شده در کد HTML شما را حذف کرده و تنها به یک فضای خالی بین کلمات تبدیل می کند.

به هر تعدادی از فضای خالی یا خط خالی بین حروف استفاده کنید، نتیجه یکی خواهد بود. یک فضای خالی بین دو کلمه.

مثال

<p>
در این پاراگراف

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


و فقط یک حرف فاصله بین هر کلمه باقی می گذارد.
</p>

خودتان آزمایش کنید »


هرگز تگ پایانی را فراموش نکنید

بعضی از المان های HTML در صورتی که تگ بسته (پایانی) آن را نیز فراموش کنید به درستی نمایش داده می شوند.

مثال

  <p>این یک پاراگراف است که تگ پایانی ندارد
  <p>این یک پاراگراف است که تگ پایانی ندارد

خودتان آزمایش کنید »

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

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

Note ولی همیشه نتیجه درست نیست و ممکن است تگ پایانی در جایی اشتباه بسته شود و در نتیجه خطاهای ناخواسته در نمایش صفحه وب شما تولید کند. از این روی، هر گز فراموش نکنید که از تگ پایانی استفاده نمایید.

شکستن خط در HTML

در اسناد HTML برای رفتن به خط بعد و شکستن یک خطط درون یک متن از تگ <br> استفاده می شود.

در صورتی که می خواهید بدون استفاده مجدد از تگ پاراگراف <p> جمله خود را با پایان برسانید و از ابتدای خط بعد جمله جدید را آغاز کنید از تگ <br> استفاده نمایید:

مثال

<p>این یک متن از نوع <br>پاراگراف است که در آن<br>از المانی برای شکستن خطوط استفاده شده است</p>

خودتان آزمایش کنید »

المان <br> از نوع تگ های تنها است که تگ پایانی ندارد.


مشکل شعر نویسی!

مثال

<p>این رباعی در یک خط نمایش داده می شود:</p>

<p>

  اين قافله عمر عجـب می گذرد

  درياب دمی کـه با طرب می گذرد

  ساقی غم فردای حریفان چه خوری

  پيش آر پیاله را که شب می گذرد

</p>

خودتان آزمایش کنید »

المان <pre> در HTML (پیش فرمت شده)

المان <pre> که مخفف Pre-formated یا پیش فرمت شده است، به کاربر اجازه می دهد تا متن خود را دقیقاً به همان شکلی که در این تگ چیدمان می کند به نمایش بگذارد و تمام فاصله های اضافی یا شکست خطوط یا خطوط خالی اضافی را در هنگام نمایش صفحه وب به همان شکل نمایش می دهد.

در صورتی که می خواهید همان طور که می نویسید نمایش دهید از تگ <pre> استفاده کنید:

مثال

<p>این رباعی همان طور که نوشته شده است نمایش داده می شود:</p>

<pre>

  اين قافله عمر عجـب می گذرد

  درياب دمی کـه با طرب می گذرد

  ساقی غم فردای حریفان چه خوری

  پيش آر پیاله را که شب می گذرد

</pre>

خودتان آزمایش کنید »

مرجع تگ ها و المان های HTML

در زیر جدولی از عناصر، المان ها یا همان تگ های HTML را ملاحظه می فرمایید که به دسته بندی پاراگراف ها مربوط است.

نام تگ HTML توضیح درباره تگ HTML
<p> یک پاراگراف را تعریف می کند
<br> ادامه متن را به ابتدای سطر بعد منتقل می کند و خط متن را می شکند
<pre> قالب بندی و چیدمان حروف را (تعداد فاصله ها و سطرهای خالی) از پیش تعیین می کند
نظر و پرسش و پاسخ کاربران
  نخستین نفری باشید که می پسندید.
نمایش 0 نظر ترتیب نمایش

در صفحه "آشنایی استفاده از پاراگراف ها در HTML - تگ p": نخستین نظر دهنده باشید
مشاهده نظرات
نام

نظرات خود را مطرح کنید
*
*
*
*
*
Captcha:
آخرین اخبار و مقالات

آگهی ها
کارگزاران تجارت الکترونیک ایران
گرافیک پوسته وب سایت در کامپیوتر
گرافیک پوسته وب سایت در تبلت
گرافیک پوسته وب سایت در موبایل
طراحی واکنشگرا (Responsive)
پنل مدیریتی پیشرفته و کاربر پسند
قابل توسعه و ارتقاء و 100% داینامیک
امکانات کامل SEO برای موتورهای جستجو
123movies