:focus

מיישם עיצוב על אלמנט כאשר הוא מקבל את הפוקוס.



מה זה :focus?

הפקטור :focus מיישם עיצוב על אלמנט כאשר הוא מקבל את הפוקוס, כמו כאשר המשתמש מקליק עליו או עובר עליו באמצעות מקש ה-TAB.

סינטקס

selector:focus {
      property: value;
    }

דוגמה לשימוש ב-focus

להלן דוגמה לשימוש בפקטור :focus:

אפשר להגדיר את זה לדוגמה כך

    
            <style>
              input {
                border: 2px solid #ccc;
                padding: 10px;
                transition: border-color 0.3s;
              }
              input:focus {
                border-color: #4CAF50;
                outline: none;
              }
            </style>
            <input type="text" placeholder="הקלד כאן">
          
    

עוד בקטגוריה Pseudo-Classes and Pseudo-Elements (מצבים מיוחדים של אלמנטים וחלקים ספציפיים של אלמנט)

תגובות

רק רגע

שיתוף