الفرق بين المراجعتين ل"CSS/::placeholder"

المراجعة الحالية بتاريخ 20:04، 24 أكتوبر 2018

العنصر الزائف ‎::placeholder‎ في CSS (أي pseudo-element) يُمثِّل النص البديل في أحد عناصر النماذج <form>:

::placeholder {
  color: blue;
  font-size: 1.5em;
}

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

::placeholder

لا يسمَح إلا باستخدام مجموعة جزئية من خاصيات CSS التي يمكن تطبيقها على العنصر الزائف ‎::first-line.

مثال عن استخدام هذا العنصر الزائف لتنسيق النص البديل المعروض في عنصر <input>:

<input placeholder="اكتب شيئًا هنا">

شيفرة CSS:

input::placeholder {
  color: red;
  font-size: 1.2em;
  font-style: italic;
}

الميزة	Chrome	Firefox	Internet Explorer	Opera	Safari
الدعم الأساسي	57.0	51.0	غير مدعومة	44	10.1
دعم جزئي مع سابقة	مدعومة	مدعومة	10 (مع السابقة `-ms-`)	مدعومة	5 (مع السابقة `-webkit-`)

صفحة الصنف الزائف placeholder-shown: الذي يُمثِّل أي عنصر <input> أو <textarea> الذي يُظهِر نصًا بديلًا (placeholder text).

@@ سطر 11: / سطر 11: @@
 == أمثلة ==
 مثال عن استخدام هذا العنصر الزائف لتنسيق النص البديل المعروض في عنصر <code>[[HTML/input|<input>]]</code>:<syntaxhighlight lang="html">
-<input placeholder="Type something here!">
+<input placeholder="اكتب شيئًا هنا">
 </syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css">
@@ سطر 43: / سطر 43: @@
 |5 (مع السابقة <code>-webkit-</code>)
 |}
-==مصادر ومواصفات==
+==انظر أيضًا==
+* صفحة الصنف الزائف <code>[[CSS/:placeholder-shown|placeholder-shown:]]</code> الذي يُمثِّل أي عنصر <code>[[HTML/input|<input>]]</code> أو <code>[[HTML/textarea|<textarea>]]</code> الذي يُظهِر نصًا بديلًا (placeholder text).
+== مصادر ومواصفات ==
 * مسودة [https://drafts.csswg.org/css-pseudo-4/#placeholder-pseudo CSS Pseudo-Elements Level 4].
 [[تصنيف:CSS|{{SUBPAGENAME}}]]
 [[تصنيف:CSS Selectors|{{SUBPAGENAME}}]]
 [[تصنيف:CSS pseudo-element|{{SUBPAGENAME}}]]