במדריך זה, נסביר שיטות שונות לשינוי הצבע של מציין מיקום הקלט באמצעות CSS.
שיטה 1: שנה את צבע מציין הקלט באמצעות הבורר '::placeholder'.
CSS ' :: מציין מקום ' הבורר משמש לבחירת רכיבי הטופס עם טקסט מציין המיקום. ניתן להשתמש בו כדי לשנות את טקסט מציין המיקום. בנוסף, אתה יכול להשתמש בבורר זה כדי לשנות את הצבע של מציין המיקום של הקלט.
תחביר
התחביר של המציין ::placeholder הוא כדלקמן:
:: מציין מיקום {
צֶבַע : ערך
}
במקום ' ערך ', אתה יכול להגדיר את הצבע של מציין המיקום של הקלט לפי בחירתנו.
נעבור לדוגמא המעשית, שבה נשנה את הצבע של מציין המיקום של הקלט.
דוגמא
כדי לשנות את צבע מציין המיקום של הקלט, ראשית, ניצור רכיב קלט באמצעות התג ונקבע את סוג הקלט כ' טֶקסט '. לאחר מכן, הגדר את הטקסט של מציין המיקום של הקלט כ' להיכנס השם שלך '.
HTML
< גוּף >< קֶלֶט סוּג = 'טֶקסט' מציין מיקום = 'הזן את שמך' >
< / גוּף >
הפלט של הקוד הנתון הוא:
צבע ברירת המחדל של מציין המיקום של הקלט מוצג בתמונה הנתונה למעלה.
כעת, אנו עוברים ל-CSS ומשתמשים ב-' :: מציין מקום ' כדי לגשת לטקסט של מציין המיקום של הקלט ולהגדיר את צבעו כ' rgb(17, 0, 255) '.
CSS
:: מציין מיקום {צֶבַע : rgb ( 17 , 0 , 255 ) ;
}
כפי שאתה יכול לראות, הצבע של מציין המיקום שנוסף משתנה לכחול:
קיימת שיטה נוספת לשנות את הצבע של מציין המיקום של הקלט. בוא נבדוק את זה.
שיטה 2: שנה את צבע מציין הקלט באמצעות '::-webkit-input-placeholder' אלמנט Pseudo-class
' :: – webkit-input-placeholder ” אלמנט פסאודו-class מייצג בעיקר את טקסט מציין המיקום של אלמנט טופס. מעצבי ומפתחי ערכות נושא יכולים להשתמש בו כדי להתאים אישית את המראה של טקסט מציין המיקום. בנוסף, על ידי שימוש ברכיב שצוין המשתמש יכול לשנות את הצבע של מציין מיקום קלט.
תחביר
תחביר של ::-webkit-input-placeholder ניתן כ:
:: -webkit-input-placeholder {צֶבַע : ערך
}
במקום ' ערך ', אתה יכול להגדיר את הצבע של מציין המיקום של הקלט.
בואו נעבור לדוגמא כדי להבין את האלמנט הפסאודו-קלאס הנדון לעיל.
דוגמא
בקובץ CSS, השתמש ב-' ::-webkit-input-placeholder ' רכיב פסאודו-קלאס והקצו את הערך של צבע כ' rgb(255, 13, 13) ”:
:::: -webkit-input-placeholder {צֶבַע : rgb ( 255 , 13 , 13 ) ;
}
תְפוּקָה
כאן, אתה יכול לראות שצבע ברירת המחדל של מציין המיקום של הקלט השתנה.
סיכום
הצבע של מציין המיקום של הקלט משתנה על ידי שימוש ב-' :: מציין מקום 'בורר ו' :: – webkit-input-placeholder 'אלמנט פסאודו-קלאסי. באמצעות זה, אתה יכול לשנות את צבע ברירת המחדל של מציין המיקום של הקלט. במאמר זה, הסברנו את ההליך הקשור לשינוי הצבע של מציין המיקום של הקלט באמצעות מאפייני CSS.