clear text XML Django JavaScript MATLAB C C++ C# Python SQL Shell Bash Markdown YAML JSON HTML CSS PHP Java Ruby Go Rust Swift Kotlin Arduino TypeScript Perl Autohotkey Lua SQF R Scala Haskell Groovy Dart Clojure VB.NET Objective-C PowerShell Bash CoffeeScript Verilog

<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <title>Taller de Arte Universitario</title> <style> body { font-family: Arial, sans-serif; background-color: #f0f8ff; margin: 0; padding: 20px; } .container { max-width: 600px; margin: 0 auto; background-color: #ffffff; padding: 20px; border-radius: 10px; border: 2px solid #4a90e2; } .header { text-align: center; margin-bottom: 30px; color: #2c3e50; } h1 { color: #e74c3c; margin-bottom: 10px; } h2 { color: #3498db; font-size: 18px; } .form-section { background-color: #f8f9fa; margin-bottom: 10px; padding: 20px; border-radius: 8px; } .section-title { color: #2c3e50; margin-bottom: 15px; font-size: 16px; } .form-group { margin-bottom: 15px; } label { display: block; margin-bottom: 5px; font-weight: bold; color: #34495e; } input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="date"], select, textarea { width: 100%; padding: 8px; border: 1px solid #bdc3c7; border-radius: 4px; font-size: 14px; } .radio-group, .checkbox-group { margin-top: 10px; } .radio-option, .checkbox-option { display: inline-block; margin-right: 20px; margin-bottom: 8px; } .radio-option input, .checkbox-option input { width: auto; margin-right: 5px; } .button-group { text-align: center; margin-top: 25px; } button { padding: 12px 25px; margin: 0 10px; border: none; border-radius: 5px; font-size: 16px; cursor: pointer; } .btn-submit { background-color: #27ae60; color: white; } .btn-reset { background-color: #e74c3c; color: white; } </style> </head> <body> <div class="container"> <div class="header"> <h1>Taller de Arte Universitario</h1> <h2>Inscripción 2024</h2> </div> <form action="#" method="post"> <div class="form-section"> <div class="section-title">Información Personal</div> <div class="form-group"> <label for="nombre">Nombre completo *</label> <input type="text" id="nombre" name="nombre" required maxlength="50" placeholder="Ingrese su nombre completo"> </div> <div class="form-group"> <label for="email">Correo electrónico *</label> <input type="email" id="email" name="email" required placeholder="ejemplo@correo.com"> </div> <div class="form-group"> <label for="telefono">Teléfono *</label> <input type="tel" id="telefono" name="telefono" required pattern="[0-9]{10}" placeholder="10 dígitos sin espacios"> </div> <div class="form-group"> <label for="edad">Edad *</label> <input type="number" id="edad" name="edad" required min="18" max="65" placeholder="Entre 18 y 65 años"> </div> </div> <div class="form-section"> <div class="section-title">Información del Taller</div> <div class="form-group"> <label>Tipo de taller *</label> <div class="radio-group"> <label class="radio-option"> <input type="radio" name="taller" value="pintura" required> Pintura </label> <label class="radio-option"> <input type="radio" name="taller" value="escultura"> Escultura </label> <label class="radio-option"> <input type="radio" name="taller" value="dibujo"> Dibujo </label> <label class="radio-option"> <input type="radio" name="taller" value="fotografia"> Fotografía </label> </div> </div> <div class="form-group"> <label for="nivel">Nivel *</label> <select id="nivel" name="nivel" required> <option value="">Seleccione su nivel</option> <option value="principiante">Principiante</option> <option value="intermedio">Intermedio</option> <option value="avanzado">Avanzado</option> </select> </div> <div class="form-group"> <label for="horario">Horario preferido *</label> <select id="horario" name="horario" required> <option value="">Seleccione horario</option> <option value="mañana">Mañana (8:00 - 12:00)</option> <option value="tarde">Tarde (14:00 - 18:00)</option> <option value="noche">Noche (18:00 - 22:00)</option> </select> </div> <div class="form-group"> <label for="fecha">Fecha de inicio *</label> <input type="date" id="fecha" name="fecha" required> </div> </div> <div class="form-section"> <div class="section-title">Materiales</div> <div class="form-group"> <label>Materiales que posee</label> <div class="checkbox-group"> <label class="checkbox-option"> <input type="checkbox" name="materiales" value="pinceles"> Pinceles </label> <label class="checkbox-option"> <input type="checkbox" name="materiales" value="lienzos"> Lienzos </label> <label class="checkbox-option"> <input type="checkbox" name="materiales" value="acrilicos"> Acrílicos </label> <label class="checkbox-option"> <input type="checkbox" name="materiales" value="oles"> Óleos </label> <label class="checkbox-option"> <input type="checkbox" name="materiales" value="carboncillo"> Carboncillo </label> <label class="checkbox-option"> <input type="checkbox" name="materiales" value="camara"> Cámara </label> </div> </div> <div class="form-group"> <label>¿Necesita kit de materiales? *</label> <div class="radio-group"> <label class="radio-option"> <input type="radio" name="kit" value="si" required> Sí </label> <label class="radio-option"> <input type="radio" name="kit" value="no"> No </label> </div> </div> </div> <div class="form-section"> <div class="section-title">Información Adicional</div> <div class="form-group"> <label for="experiencia">Experiencia previa</label> <textarea id="experiencia" name="experiencia" maxlength="100" placeholder="Máximo 100 caracteres">

Alergias o condiciones especiales