سؤال

لقد جربت كل شيء للحصول على Firefox لاستخدام اللون الذي أحدده كأنه لون العنصر النائب على أشكالي. بما في ذلك استخدام :-moz-placeholder في CSS الخاص بي وكل شيء حتى الآن اللون الناتج ليس ما أحدده أبدًا.

أدرك أن Firefox يستخدم اللون الرمادي الخفيف لونه الافتراضي/لونه النائب ، ولكن لماذا يوجد خيار لتغييره إذا لم يغيره تمامًا؟

إليك codepen التي قمت بها لإظهارها بما في ذلك جميع CSS Firefox المحددة:

قديم: http://codepen.io/jtlr/pen/bpjft

جديد: http://codepen.io/jtlr/pen/ekjhh

هل كانت مفيدة؟

المحلول

إليكم ما هو التصميم الافتراضي في Firefox:

input::-moz-placeholder,
textarea::-moz-placeholder {
  opacity: 0.54;
}

بدون أي أنماط ألوان على الإطلاق (المرجع هو http://hg.mozilla.org/mozilla-central/file/a07aebef20e7/layout/style/forms.css#l160). هذا مهم ، لأنه بهذه الطريقة إذا قمت للتو بتعيين color و background في مدخلاتك ، وليس لديك أي تصميم خاص بتصميم خاص ، فسوف يلتقط اللون الذي تحدده ولكن فقط اجعله يبدو أكثر تلاشى.

لذلك إذا كنت ترغب في إعادة تصوير العنصر النائب تمامًا ، فقم بتعيين عتامه على 1.

نصائح أخرى

Firefox 19+ يتطلب 2 كولون ..::

لذلك استخدم ::-moz-placeholder

تم تقديم العناصر الزائفة ::-Moz-placeholder كبديل عن الفئة الزائفة: -moz-placeholder التي تم إهمالها في Firefox 19.

في مقابل :-moz-placeholder

سيتم إهمال: -moz-placeholder pseudo-class لصالح ::-Moz-placeholder pseudo element in Firefox 19.

مثال العمل codepen - FF فقط.

::-moz-placeholder {
  color:red;
}

بصرف النظر عن ذلك ، هذا محدد ، على عكس الممتلكات. وبالتالي،

p { :-moz-placeholder: #000000; }

غير صحيح.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top