آموزش html - پاراگراف ها

تعداد بازدید: 514

پاراگراف HTML

عنصر <p> یک پاراگراف را تعریف می کند.

یک پاراگراف همیشه در یک خط جدید شروع می شود ، و مرورگرها به طور خودکار فضای سفید (حاشیه) را قبل و بعد از یک پاراگراف اضافه می کنند.

<p>This is a paragraph.</p>
<p>This is another paragraph.</p> 

نمایش HTML

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

صفحه های بزرگ یا کوچک و ویندوزهای با اندازه بزرگ نتایج متفاوتی ایجاد می کنند.

با HTML ، نمی توانید صفحه را با اضافه کردن فضاهای اضافی یا خطوط اضافی در کد HTML خود تغییر دهید.

مرورگر به طور خودکار هر فضای و خط اضافی را هنگام نمایش صفحه حذف می کند:

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

نتیجه کد بالا به صورت زیر است:

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

ایجاد خط افقی

برچسب <hr> یک وقفه موضوعی را در یک صفحه HTML تعریف می کند و بیشتر اوقات به عنوان یک خط افقی نمایش داده می شود.

عنصر <hr> برای جدا کردن محتوا (یا تعریف تغییر) در یک صفحه HTML استفاده می شود.

در کد زیر هر جا که <hr> باشد، یک خط افقی قرار داده خواهد شد:

<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<hr> 

تگ <hr> یک تگ خالی است ، به این معنی که هیچ تگ پایانی ندارد.

رفتن به خط بعد

عنصر <br> شکست خط را تعریف می کند.

اگر می خواهید خط (خط جدید) بدون شروع یک پاراگراف جدید استفاده کنید:

<p>This is<br>a paragraph<br>with line breaks.</p> 

تگ <br> یک برچسب خالی است ، به این معنی که هیچ برچسب انتهایی ندارد.

نمایش شعر در html

برای نمایش شعر با حفظ حالت نمی توان از <p> استفاده کرد.

عنصر <pre> متن پیش فرض را تعریف می کند.

متن درون یک عنصر <pre> با قلم با عرض ثابت نمایش داده می شود ، و هم فضا و هم شکاف خط را حفظ می کند:

<pre>
مژده اي دل که مسیحا نفسی می آید

که ز انفاس خوشش بوی کسی می آید

از غم هجر مکن ناله و فریاد که من

زده‌ام فالی و فریادرسی می آید
</pre>

مطالب تصادفی

سید خلیل حسینی

کارشناس کامپیوتر، علاقه مند و فعال در حوزه برنامه نویسی و طراحی سایت
برنامه نویس بک اند پی اچ پی و لاراول 
برنامه نویس فرانت اند
پلاگین نویس و طراح صفحات وردپرس

blog-author-image