CSS : محدد التركيز
مثال
حدد حقل إدخال ونمطه عندما يتم التركيز عليه:
input:focus
{
background-color: yellow;
}
المزيد من الأمثلة "جربها بنفسك" أدناه.
التعريف والاستخدام
يتم :focus
استخدام المحدد لتحديد العنصر الذي تم التركيز عليه.
نصيحة: يُسمح بمحدد التركيز على العناصر التي تقبل أحداث لوحة المفاتيح أو إدخالات المستخدم الأخرى.
الإصدار: | CSS2 |
---|
دعم المتصفح
تحدد الأرقام الواردة في الجدول إصدار المتصفح الأول الذي يدعم المحدِّد بشكل كامل.
Selector | |||||
---|---|---|---|---|---|
:focus | 4.0 | 8.0 | 2.0 | 3.1 | 9.6 |
بنية CSS
:focus {
css declarations;
}
مزيد من الأمثلة
مثال
عندما يتم التركيز على <input type = "text"> ، قم بتغيير العرض تدريجيًا من 100 بكسل إلى 250 بكسل:
input[type=text] {
width: 100px;
transition: ease-in-out, width .35s ease-in-out;
}
input[type=text]:focus {
width: 250px;
}
الصفحات ذات الصلة
دروس CSS: فصول CSS الزائفة