Semantic UI es un marco de desarrollo front-end de código abierto similar a Bootstrap para diseñar una página web atractiva. Tiene muchos componentes que ayudan a crear un diseño de sitio web atractivo y receptivo.
La entrada de interfaz de usuario semántica es un campo que se utiliza para obtener información de los usuarios. Tipo de entrada define el tipo de entrada que solicitó al usuario.
Clase de tipos de entrada de interfaz de usuario semántica:
- entrada: esta clase se utiliza para crear un campo de entrada estándar.
Sintaxis:
<div class="ui input"> <input type="text" placeholder=""> </div>
Nota: El tipo de entrada en Semantic-UI es el mismo que el tipo de entrada en HTML .
Ejemplo:
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;"> 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>
Producción:
Referencia: https://semantic-ui.com/elements/input.html