color

شرح خاصية css color

خاصية CSS color هي خاصية تستخدم لتحديد لون النص داخل عنصر HTML. يمكن استخدامها لتغيير لون النص بين العديد من الألوان المختلفة.

تتضمن القيم المقبولة لخاصية color الأسماء الأساسية للألوان مثل الأسود (black) والأبيض (white) والأحمر (red) والأزرق (blue) والأخضر (green) والأصفر (yellow) والرمادي (gray) والأرجواني (purple) والبني (brown) والبرتقالي (orange) وغيرها الكثير. يمكن أيضًا استخدام القيم المحددة بالRGB أو الHEX لتحديد لون محدد.

مثال:

p {
  color: red;
}

هذا التعليمات البرمجية سيغير لون النص داخل عنصر p إلى اللون الأحمر. يمكن استخدام أي من الأسماء الأساسية للألوان أو القيم المحددة بالRGB أو الHEX لتحديد لون مختلف.

بالإضافة إلى تحديد لون النص، يمكن استخدام خاصية color لتحديد لون خلفية النص باستخدام الخاصية background-color.

مثال:

p {
  color: white;
  background-color: blue;
}

هذا التعليمات البرمجية سيجعل لون النص داخل عنصر p أبيض ولون خلفية النص أزرق.

يمكن أيضًا استخدام خاصية color لتحديد لون روابط النص باستخدام الخاصية a:link، ولون روابط النص عند التحويل باستخدام الخاصية a:visited.

مثال:

a:link {
  color: blue;
}

a:visited {
  color: purple;
}

هذا التعليمات البرمجية سيجعل لون روابط النص الغير محولة باللون الأزرق، ولون روابط النص المحولة باللون الأرجواني.

باستخدام خاصية color، يمكن تغيير لون النص بشكل ديناميكي بناءً على حالة العنصر، مثل عند تحريك المؤشر فوقه أو عند النقر عليه باستخدام الخاصية :hover و :active.

مثال:

button:hover {
  color: white;
  background-color: blue;
}

button:active {
  color: red;
  background-color: green;
}

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

باستخدام خاصية color في CSS، يمكن تحديد العديد من الألوان المختلفة لتصميم صفحات الويب بشكل مرن ومتنوع.