الفرق بين المراجعتين لصفحة: «HTML/p»

المراجعة الحالية بتاريخ 08:39، 18 فبراير 2018

يُمثِّل العنصر <p> فقرةً نصيةً، وتُعرَض الفقرات عادةً على شكل أقسام من النص يفصل بينها بمسافة فارغة رأسية، أو بزيادة محاذاة أوّل سطر.

مثال عن استخدام العنصر <p>:

<p>تهدف موسوعة حسوب لتوفير توثيق عربي كامل وعالي الجودة، مدعّم بالأمثلة لمختلف لغات البرمجة وتقنيات تطوير الويب والجوال. تعتمد الموسوعة على فريق من المحررين والمساهمين المتطوعين أولي الخبرة البرمجية واللغوية، وترحّب بكل من يرغب بالمساهمة فيها. اعرف المزيد عن موسوعة حسوب بتصفح محتواها واطلع على دليل المساهمين.</p>

<p>محتوى موسوعة حسوب هو محتوى مرجعي، أي هو أقرب للقاموس تبحث فيه عمّا تحتاج له عند الحاجة. إذا كنت تبحث عن دروس تطبيقية، فننصحك بزيارة أكاديمية حسوب.</p>

بطاقة العنصر

تصنيفات المحتوى	محتوى تنظيمي.
المحتوى المسموح	محتوى عادي.
الوسم المختصر	وسم البداية مطلوب. لكن وسم النهاية يمكن حذفه إذا أتى بعد العنصر `<p>` عنصر `<address>` أو `<article>` أو `<aside>` أو `<blockquote>` أو `<div>` أو <dl> أو `<fieldset>` أو `<footer>` أو `<form>` أو `<h1>-<h6>` أو `<header>` أو `<hr>` أو `<menu>` أو `<nav>` أو `<ol>` أو `<pre>` أو `<section>` أو `<table>` أو `<ul>` أو عنصر `<p>` آخر مباشرةً، أو لم يعد هنالك محتوى إضافة في العنصر الأب ولم يكن العنصر الأب `<a>`.
العناصر الأب	أي عنصر يقبل المحتوى التنظيمي.
واجهة DOM	`HTMLParagraphElement`

دعم المتصفحات

Chrome	Firefox	Edge	Safari	Opera
مدعوم	مدعوم	مدعوم	مدعوم	مدعوم

الخاصيات

يمكن استخدام الخاصيات العامة في هذا العنصر.

أصبحت الخاصية align قديمة ومهملة وغير مدعومة في HTML5، فلا تستعملها مع العنصر <p>.

التنسيق الافتراضي

أغلبية المتصفحات تعرض العنصر <p> مع ضبط الخاصية display إلى block، وجعل الهامش العلوي margin-top والسفلي margin-bottom يساوي 1em، وضبط الهامش الأيسر margin-left والأيمن margin-right إلى 0:

p {
  display: block;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
}

مصادر ومواصفات

معيار HTML Living Standard.
مواصفة HTML5، حذف الخاصية align.
مواصفة HTML 4.01.

@@ سطر 3: / سطر 3: @@
 مثال عن استخدام العنصر <code><nowiki><p></nowiki></code>:<syntaxhighlight lang="html">
-<p>This is the first paragraph of text.
+<p>تهدف موسوعة حسوب لتوفير توثيق عربي كامل وعالي الجودة، مدعّم بالأمثلة لمختلف لغات البرمجة وتقنيات تطوير الويب والجوال. تعتمد الموسوعة على فريق من المحررين والمساهمين المتطوعين أولي الخبرة البرمجية واللغوية، وترحّب بكل من يرغب بالمساهمة فيها. اعرف المزيد عن موسوعة حسوب بتصفح محتواها واطلع على دليل المساهمين.</p>
-  This is the first paragraph of text.
-  This is the first paragraph of text.
+<p>محتوى موسوعة حسوب هو محتوى مرجعي، أي هو أقرب للقاموس تبحث فيه عمّا تحتاج له عند الحاجة. إذا كنت تبحث عن دروس تطبيقية، فننصحك بزيارة أكاديمية حسوب.</p>
-  This is the first paragraph of text.</p>
-<p>This is the second paragraph.
- This is the second paragraph.
- This is the second paragraph.
- This is the second paragraph.</p>
 </syntaxhighlight>
+== بطاقة العنصر ==
 {| class="wikitable" style="width: 100%;"
 |-
@@ سطر 22: / سطر 18: @@
 |-
 ! scope="row" | الوسم المختصر
-| وسم البداية مطلوب. لكن وسم النهاية يمكن حذفه إذا أتى بعد العنصر <code><nowiki><p></nowiki></code> عنصر <code>[[HTML/address|<address>]]</code> أو <code>[[HTML/article|<article>]]</code> أو <code>[[HTML/aside|<aside>]]</code> أو <code>[[HTML/blockquote|<nowiki><blockquote></nowiki>]]</code> أو <code>[[HTML/div|<nowiki><div></nowiki>]]</code> أو [[HTML/dl|<nowiki><dl></nowiki>]] أو <code>[[HTML/fieldset|<fieldset>]]</code> أو <code>[[HTML/footer|<footer>]]</code> أو <code>[[HTML/form|<form>]]</code> أو <code>[[HTML/h1-h6|<nowiki><h1>-<h6></nowiki>]]</code> أو <code>[[HTML/header|<header>]]</code> أو <code>[[HTML/hr|<nowiki><hr></nowiki>]]</code> أو <code>[[HTML/menu|<menu>]]</code> أو <code>[[HTML/nav|<nav>]]</code> أو <code>[[HTML/ol|<nowiki><ol></nowiki>]]</code> أو <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> أو <code>[[HTML/section|<section>]]</code> أو <code>[[HTML/table|<nowiki><table></nowiki>]]</code> أو <code>[[HTML/ul|<nowiki><ul></nowiki>]]</code> أو عنصر <code><nowiki><p></nowiki></code> آخر مباشرةً، أو لم يعد هنالك محتوى إضافة في العنصر الأب ولم يكن العنصر الأب <code></code>.
+| وسم البداية مطلوب. لكن وسم النهاية يمكن حذفه إذا أتى بعد العنصر <code><nowiki><p></nowiki></code> عنصر <code>[[HTML/address|<address>]]</code> أو <code>[[HTML/article|<article>]]</code> أو <code>[[HTML/aside|<aside>]]</code> أو <code>[[HTML/blockquote|<nowiki><blockquote></nowiki>]]</code> أو <code>[[HTML/div|<nowiki><div></nowiki>]]</code> أو [[HTML/dl|<nowiki><dl></nowiki>]] أو <code>[[HTML/fieldset|<fieldset>]]</code> أو <code>[[HTML/footer|<footer>]]</code> أو <code>[[HTML/form|<form>]]</code> أو <code>[[HTML/h1-h6|<nowiki><h1>-<h6></nowiki>]]</code> أو <code>[[HTML/header|<header>]]</code> أو <code>[[HTML/hr|<nowiki><hr></nowiki>]]</code> أو <code>[[HTML/menu|<menu>]]</code> أو <code>[[HTML/nav|<nav>]]</code> أو <code>[[HTML/ol|<nowiki><ol></nowiki>]]</code> أو <code>[[HTML/pre|<nowiki><pre></nowiki>]]</code> أو <code>[[HTML/section|<section>]]</code> أو <code>[[HTML/table|<nowiki><table></nowiki>]]</code> أو <code>[[HTML/ul|<nowiki><ul></nowiki>]]</code> أو عنصر <code><nowiki><p></nowiki></code> آخر مباشرةً، أو لم يعد هنالك محتوى إضافة في العنصر الأب ولم يكن العنصر الأب <code><a></code>.
 |-
 ! scope="row" | العناصر الأب
@@ سطر 50: / سطر 46: @@
 أصبحت الخاصية <code>align</code> قديمة ومهملة وغير مدعومة في HTML5، فلا تستعملها مع العنصر <code><nowiki><p></nowiki></code>.
+== التنسيق الافتراضي ==
+أغلبية المتصفحات تعرض العنصر <code><nowiki><p></nowiki></code> مع ضبط الخاصية <code>[[CSS/display|display]]</code> إلى <code>block</code>، وجعل الهامش العلوي <code>[[CSS/margin-top|margin-top]]</code> والسفلي <code>[[CSS/margin-bottom|margin-bottom]]</code> يساوي <code>1em</code>، وضبط الهامش الأيسر <code>[[CSS/margin-left|margin-left]]</code> والأيمن <code>[[CSS/margin-right|margin-right]]</code> إلى <code>0</code>:<syntaxhighlight lang="css">
+p {
+  display: block;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  margin-left: 0;
+  margin-right: 0;
+}
+</syntaxhighlight>
 ==مصادر ومواصفات==