The required selector is used to select the required element with the required attribute and set the CSS property. Form elements with a required attribute are defined as required.
Note: This selector is used with form elements, eg. <input>, <select> and <textarea>.
Syntax:
:required { // CSS Property }
Example:
<!DOCTYPE html> < html > < head > < title >:required Selector</ title > < style > h1 { color: green; } body { text-align:center; } input:required { background-color: green; color: white; } form div { padding: 10px; } label { display: block; font-size: 18px; } input { border: 1px solid black; padding: 9px; font-size: 18px; } </ style > </ head > < body > < h1 >GeeksforGeeks</ h1 > < h2 >:required selector</ h2 > < form > < div > < label for = "name" >Name</ label > < input type = "text" name = "name" id = "name" /> </ div > < div > < label for = "email" >Email</ label > < input type = "email" name = "email" id = "email" required /> </ div > < div > < input type = "submit" value = "Submit" /> </ div > </ form > </ body > </ html > |
Output:
Supported Browsers: The browser supported by :required Selector are listed below:
- Apple Safari 5.0
- Google Chrome 10.0
- Firefox 4.0
- Opera 10.0
- Internet Explorer 10.0
leave a comment
0 Comments