كيفية تغيير لون النص في كس الإدخال: دليل مفصل مع أمثلة

الإدخال هو واحد من عناصر النموذج الأكثر شيوعا في هتمل. يتم استخدامه لإنشاء حقول إدخال حيث يمكن للمستخدم إدخال النص والبيانات والمعلومات الأخرى. ومع ذلك ، قد لا يكون مظهر وأسلوب الإدخال مرضيا دائما. في مثل هذه الحالات ، كس يجعل من السهل تغيير لون النص في حقل الإدخال لجعله أكثر جاذبية ومتسقة مع تصميم الموقع.

يمكنك تغيير لون النص في حقل الإدخال باستخدام خاصية اللون في كس. تسمح لك هذه الخاصية بتعيين لون نص الإدخال بأي لون متاح باستخدام الكلمات الرئيسية أو قيم رغب أو رموز الألوان السداسية.

مثال 1: تعيين لون نص الإدخال باستخدام الكلمات الرئيسية.

1. الغرض من الدليل
2. المبادئ الأساسية
3. لون النص في المغلق الإدخال: أساسيات
4. كيفية تعيين لون النص
5. 1. استخدام الكلمات الرئيسية
6. 2. استخدام رموز الألوان
7. 3. باستخدام رغبا
8. 4. باستخدام هسل و هسلاف
9. أمثلة
10. تعيين لون النص الافتراضي
11. كيفية تغيير لون النص عند التمرير
12. أمثلة على تغيير لون النص في كس الإدخال
13. مثال 1: تغيير لون النص أثناء التنشيط
14. مثال 2: تغيير لون النص في حالة حدوث خطأ
15. سؤال وجواب
16. كيف يمكنني تغيير لون النص في حقل الإدخال?
17. هل من الممكن تعيين لون نص مختلف لحقول الإدخال المختلفة على الصفحة?
18. كيف يمكنني تغيير لون النص في حقل الإدخال عند التركيز عليه?
19. كيف يمكنني تغيير لون النص في حقل الإدخال عندما كنت تحوم المؤشر فوقه?
20. هل من الممكن تعيين لون نص مختلف للعنصر النائب والنص في حقل الإدخال?
21. هل من الممكن تغيير لون النص فقط في حقل إدخال واحد محدد, وليس في كل?

الغرض من الدليل

باستخدام المغلق. هنا سوف نقدم وصفا مفصلا للطرق المختلفة وأمثلة التعليمات البرمجية التي ستساعدك على تغيير لون النص في حقل الإدخال وفقا لاحتياجاتك.

. سنوضح لك أيضا كيفية تغيير لون النص اعتمادا على حالة حقل الإدخال ، مثل التركيز أو القيمة غير الصالحة.

وإنشاء واجهة مستخدم جميلة.

لنبدأ! سوف تحتاج إلى فهم أساسي من هتمل و كس لفهم هذا الدليل.

المبادئ الأساسية

يمكنك تغيير لون النص في حقل الإدخال باستخدام خاصية لون كس. تسمح لك هذه الخاصية بتعيين لون النص في حقل الإدخال باستخدام أنواع مختلفة من القيم ، مثل أسماء الألوان والقيم السداسية العشرية وقيم رغب.

فيما يلي بعض الأمثلة:

• أسماء الألوان: ويمكنك استخدام أسماء الألوان مثل" أحمر "أو" أزرق "أو"أخضر".
• القيم الست عشرية: يمكنك استخدام القيم في شكل "# رغب " ، حيث ر ، غ و بب تمثل قيم الألوان الأحمر والأخضر والأزرق ، على التوالي.
• قيم رغب: يمكنك استخدام القيم في تنسيق "رغب(الأحمر والأخضر والأزرق)" ، حيث يتم تحديد قيم الألوان الأحمر والأخضر والأزرق في النطاق من 0 إلى 255.

يمكنك تطبيق لون على حقل الإدخال داخل العلامة وفي ملف كس خارجي. من المهم أن تتذكر أنه يتم تطبيق خاصية اللون على النص في حقل الإدخال ، وليس على خلفية الحقل.

لون النص في المغلق الإدخال: أساسيات

في كس ، يمكنك بسهولة تغيير لون النص في عنصر الإدخال باستخدام خاصية اللون. يتيح لك ذلك إنشاء حقول إدخال نص أنيقة وفريدة من نوعها.

تأخذ خاصية اللون قيمة بتنسيقات مختلفة ، مثل اسم اللون (على سبيل المثال ، "أحمر") ، أو رمز اللون السداسي العشري (على سبيل المثال ، "#فف0000") ، أو وظيفة رغبا() لتحديد الشفافية.

أمثلة على استخدام خاصية اللون في عنصر الإدخال:

1. باستخدام اسم اللون:
2. باستخدام رمز سداسي عشري:
3. باستخدام وظيفة رغبا () مع الشفافية:

عند تغيير لون النص في الإدخال ، يجدر النظر في تباين النص والخلفية. يجب أن يكون النص مرئيا بوضوح وسهل القراءة للمستخدمين.

استخدم خاصية اللون في كس لإنشاء حقول إدخال نص أنيقة وجذابة.

كيفية تعيين لون النص

في كس ، يتم تحديد لون النص باستخدام خاصية اللون. يمكنك استخدام طرق مختلفة لتعيين لون النص.

1. استخدام الكلمات الرئيسية

يمكنك استخدام الكلمات الرئيسية لتحديد لون النص: أحمر ، أزرق ، أخضر ، إلخ. على سبيل المثال:

اللون: أحمر;

2. استخدام رموز الألوان

يمكنك أيضا استخدام رموز الألوان لتحديد لون النص. يمكن تعيين رموز الألوان في شكل رغب(على سبيل المثال ، رغب (255 ، 0 ، 0)) ، في شكل رقم سداسي عشري (على سبيل المثال ، #فف0000) أو باستخدام الألوان المسماة (على سبيل المثال ، المارون). على سبيل المثال:

اللون: رغب(255 ، 0 ، 0);

اللون: # 0000;

اللون: كستنائي;

3. باستخدام رغبا

رغبا هو لون مجموعة في شكل رغب مع إضافة قناة ألفا ، والذي يحدد شفافية اللون. يمكن تعيين قيمة قناة ألفا من 0 (شفافة تماما) إلى 1 (غير شفافة تماما). على سبيل المثال:

اللون: رغبا (255 ، 0 ، 0 ، 0.5);

4. باستخدام هسل و هسلاف

هسل هو لون مجموعة في لهجة الشكل والتشبع والسطوع. يمكن تعيين قيم النغمة والتشبع والسطوع في النطاق من 0 إلى 100٪. على سبيل المثال:

اللون: هسل (0 ، 100٪ ، 50٪);

يستخدم هسلا لتعيين اللون مع إضافة قناة ألفا ، والذي يحدد شفافية اللون. يمكن تعيين قيمة قناة ألفا من 0 (شفافة تماما) إلى 1 (غير شفافة تماما). على سبيل المثال:

اللون: هسلا(0, 100%, 50%, 0.5);

أمثلة

فيما يلي بعض الأمثلة على تعيين لون النص:

• - النص سيكون أحمر
• - النص سيكون أخضر
• - النص سيكون أزرق
• - سيكون النص أحمر شفاف
• - النص سيكون أزرق
• - سيكون النص أزرق شفاف

تعيين لون النص الافتراضي

عند إنشاء عنصر إدخال في كس ، يتم تحديد لون النص الافتراضي بناء على الأنماط المطبقة على هذا العنصر وأولياء أموره.

إذا لم يتم تعيين قاعدة صريحة للون نص الإدخال ، فسيتم توريثه من العنصر الأصل.

إذا كان لديك بنية هتمل التالية:

اسم المستخدم:

وأنماط كس هي كما يلي:

.شكل المجمع {

الهامش السفلي: 20 بكسل;

}

.التسمية {

اللون: # 333;

}

# اسم المستخدم {

لون الخلفية: # وما يليها;

}

في هذه الحالة ، إذا لم تكن قد حددت لون النص لعنصر الإدخال ، فسيرث لون النص من العنصر الأصل.

لذلك ، في هذا المثال ، سيكون لون نص الإدخال هو نفسه لون العنصر — #333.

كيفية تغيير لون النص عند التمرير

يمكن أن يؤدي تغيير لون النص عند التمرير فوق الماوس إلى جعل موقعك أكثر تفاعلية وجاذبية للمستخدمين. للقيام بذلك ، تحتاج إلى استخدام الفئة الزائفة :تحوم في كس.

هنا مثال على رمز كس بسيط يسمح لك بتغيير لون النص عند التمرير:

ص: تحوم {