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 =
rel = "stylesheet" />
< script src =
</ script >
</ head >
< body >
< center >
< h1 style = "color: green;" >
GeeksforGeeks
</ 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