العنصر ‎::first-line‎

من موسوعة حسوب

العنصر الزائف ‎::first-line‎ في CSS (أي pseudo-element) يؤدي إلى تطبيق الأنماط على أوّل سطر من العناصر الكتلية (block-level elements)، لاحظ أنَّ طول أوّل سطر يختلف تبعًا لعدة عوامل بما في ذلك عرض العنصر وعرض المستند وحجم الخط. 

p::first-line {
  color: red;
}

الشكل العام لهذا المحدد:

::first-line
:first-line

لاحظ أنَّ CSS3 أضافت الشكل ‎::first-line (لاحظ أنَّ قبله زوجين من النقط الرأسية) لتمييز العناصر الزائفة (pseudo-elements) عن الأصناف الزائفة (pseudo-classes)؛ لكن المتصفحات تقبل الشكل ‎:first-line المُضاف في CSS2 أيضًا.

لا يسمَح إلا باستخدام مجموعة جزئية من خاصيات CSS مع هذا العنصر الزائف:

أمثلة

مثال عن استخدام هذا العنصر الزائف لتحديد أول سطر لجميع العناصر:

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

<span>لن يتلقى السطر الأول من هذا النص نمطًا خاصًا
لأنه ليس عنصر مستوى الكتلة.</span>

شيفرة CSS:

::first-line {
  color: blue;
  text-transform: uppercase;


  /* تحذير! لا تستعمل هذه الخاصيات لأنها غير صالحة مع هذا العنصر الزائف */
  margin-left: 20px;
  text-indent: 20px;
}

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

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الأساسي (‎:first-line) 1.0 1.0 5.5 3.5 1.0
‎::first-line 1.0 1.0 9.0 7.0 1.0

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

مجلوبة من «https://wiki.hsoub.com/index.php?title=CSS/::first-line&oldid=19453»