Semantic-UI Input Types
Semantic UI is an open-source front-end development framework similar to Bootstrap to design an attractive web page. It has lots of components that help to create an attractive and responsive website layout.
Semantic-UI Input is a field that is used to get input from the users. Input type define the type of the input you asked from the user.
Semantic-UI Input Types Class:
- input: This class is used to create a standard input field.
Syntax:
<div class="ui input"> <input type="text" placeholder=""> </div>
Note: The input type in Semantic-UI is the same as the input type in HTML.
Example:
HTML
<!DOCTYPE html> < html > < head > < title >Semantic-UI Input Types</ title > < link href = "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel = "stylesheet" /> < script src = "https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js" > </ script > </ head > < body > < center > < h1 style = "color: green;" > w3wiki </ h1 > < h3 >Semantic-UI Input Types</ h3 > < div class = "ui input" > < input type = "text" placeholder = "Enter Name" > </ div > < br >< br > < div class = "ui input" > < input type = "number" placeholder = "Enter Contact No." > </ div > < br >< br > < div class = "ui input" > < input type = "email" placeholder = "Enter Email Id" > </ div > </ center > </ body > </ html > |
Output:
Reference: https://semantic-ui.com/elements/input.html
Contact Us