Los formularios Spectre proporcionan el componente de control más común utilizado en los formularios regulares. En este artículo, discutiremos la forma de radio. El formulario de radio es un componente importante que se requiere para obtener la opción booleana del usuario como de costumbre.
Formas Forma Radio Clase:
- form-radio: esta clase le da al botón de radio un aspecto de espectro que se adapta al tema de espectro.
- form-icon: Esta clase se utiliza para colocar las opciones del botón de radio.
Sintaxis:
<label class="form-radio"><label>
El siguiente ejemplo ilustra la radio de formulario Spectre Forms:
Ejemplo:
HTML
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href= "https://unpkg.com/spectre.css/dist/spectre.min.css"> <link rel="stylesheet" href= "https://unpkg.com/spectre.css/dist/spectre-exp.min.css"> <link rel="stylesheet" href= "https://unpkg.com/spectre.css/dist/spectre-icons.min.css"> </head> <body> <center> <h1 class="text-success">GeeksforGeeks</h1> <strong>SPECTRE Forms Form Radio Class</strong> <br> </center> <div class="form-group"> <label class="form-label"> Name </label> <input class="form-input" placeholder="Please type your name"> <label class="form-label"> Mail Id </label> <input class="form-input" placeholder="Your Mail Id"> <br> <label class="form-label">Gender</label> <label class="form-radio"> <input type="radio" name="gender" checked> <i class="form-icon"></i> Male </label> <label class="form-radio"> <input type="radio" name="gender"> <i class="form-icon"></i> Female </label> </label> <br> <center> <button class="btn btn-success"> LogIn </button> <button class="btn btn-error"> Sign Up </button> </center> </div> </body> </html>
Producción:
Referencia: https://picturepan2.github.io/spectre/elements/forms.html#forms-radio
Publicación traducida automáticamente
Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA