Horje
How to style Placeholder Text in an Input Field ?

Styling placeholder text in an input field in CSS involves using the ::placeholder pseudo-element. This allows you to apply styles specifically to the placeholder text within the input.

Note: The ::placeholder pseudo-element is used to target and style the placeholder text.

Syntax:

/* Styling placeholder text with a different color */
input::placeholder {
  color: #999;
}

/* Changing the font size of placeholder text */
input::placeholder {
  font-size: 14px;
}

Features:

The Features of ::placeholder Pseudo-element:

  • Targets the placeholder text within an input field.
  • Allows customization of properties such as color, font size, font style, etc.
  • Styling placeholder text provides a way to enhance the visual presentation and user experience of input fields in a form.



Reffered: https://www.geeksforgeeks.org


CSS

Related
How to implement the counter-reset Property in CSS ? How to implement the counter-reset Property in CSS ?
How to apply a Filter to an Image in CSS ? How to apply a Filter to an Image in CSS ?
What is the purpose of the object-fit Property? What is the purpose of the object-fit Property?
What is the purpose of the outline Property in CSS ? What is the purpose of the outline Property in CSS ?
Explain the purpose of the max-width Property Explain the purpose of the max-width Property

Type:
Geek
Category:
Coding
Sub Category:
Tutorial
Uploaded by:
Admin
Views:
14