APUNTES SOBRE HTML VÍNCULOS Ó ENLACES. Hay de cuatro tipos: INTERNOS: si nos sitúan en otra parte de la misma página WEB. EXTERNOS: si nos conectan con otras páginas WEB. DE DESCARGA: vínculos que al hacer “click” nos descargan un archivo que antes hemos colocado donde está nuestra WEB. DE CORREO: enlaces que al pulsarlos nos abren nuestro programa de correo para mandar un e-mail a la dirección registrada en el enlace. EXTERNOS: Tipo Texto: <a href=”http://www.google.es” title=”Página del buscador Google”> Buscador Google. </a> Tipo Gráfico: <a href=”http://www.google.es”><img scr=”mi_imagen.jpg”></a> INTERNOS: El origen sería el lugar donde aparece el hipervínculo, que al hacer “click”, saltaría a otra parte de la página. Para nuestro ejemplo sería el índice de nuestra WEB. <a href=”#tema1”> Tema 1 </a> El destino es el lugar donde se coloca “una etiqueta” y en éste justo sitio es el lugar donde saltaríamos al pulsar el enlace antes descrito, en nuestro ejemplo sería el lugar donde se localiza el “Tema 1”. <a name=”Tema 1”> DE DESCARGA: <a href=”canción.mp3”> Pulsa aquí para descargarte una canción. </a> DE CORREO: < a href=”mailto:[email protected]”> Mi correo </a> NOTA: si deseas que tu página WEB se abra en una página nueva coloca en la etiqueta target=”_blank”. Ejemplo: <a href=”destino.html” target=”_blank”> página 2. </a> APUNTES SOBRE HTML FORMULARIOS Son páginas WEB en las que recogemos información que el usuario que visita la página nos rellena, son típicos en páginas de opinión, en ventas por internet, encuestas, etc. ENCABEZAMIENTO Y FIN DE FORMULARIO. <form enctype=”text/plain” method=”post” action=”mailto:[email protected]” name =”formulario”> </form> Enctype: codificacion de los datos enviados. “Text/plain” indica tipo de datos texto. Method: método de envio, el más habitual es POST. Action: lugar donde enviamos los datos, en nuestro caso a nuestra dirección de correo. Name: nombre del formulario. ENTRADA DE TEXTO EN UNA LINEA. <input type=”text” maxlength=”50” size=”25” name=”apellidos”> NOTA: Si en vez de poner “text” pongo “password” la información se recoge normalmente pero en pantalla salen asteriscos cuando tecleo. ENTRADA DE TEXTO DE VARIAS LINEAS. <textarea cols=”75” rows=”4” name=”opinión”> </textarea> BOTONES DE OPCION. <input name=”estudios” value=”básicos” checked=”checked” type=”radio”> Estudios Básicos. <input name=”estudios” value=”avanzados” type=”radio”>Estudios avanzados. Name: nombre de la opción sobre la que elegimos. Value: valor que toma la variable que estoy rellenando. Checked: casilla que está marcada por omisión. NOTA: todas las opciones tienen el mismo nombre (name). Y solo se marca una. APUNTES SOBRE HTML CASILLAS DE VERIFICACION. <input name=”teatro” value=”1” type=”checkbox”> Teatro. <input name=”música” value=”2” type=”checkbox”> Música. Se podrán elegir tantas casillas como queramos. CUADROS DE MENÚ Y LISTAS DE SELECCIÓN. <select name=”localidad”> <option selected> Archidona</option> Archidona <option> Antequera</option> </option> <option> Málaga</option> </option> </select> La diferencia entre menú y lista es que la lista lleva una primera etiqueta size=”n”, donde “n” es el nº de filas a la vista. Si añadimos la etiqueta multiple=”multiple” podemos elegir varias opciones a la ver pulsando la tecla CTRL. BOTONES DE ACCION Enviar información: <input name=”Enviar” type=”submit”> Restablecer la información: <input name=”Borrar datos” type=”reset”> APUNTES SOBRE HTML EJEMPLO DE FORMULARIO. <html> <head> <title>formulario</title> </head> <body> <h1>Formulario</h1> <form enctype="text/plain" method="post" action="[email protected]" name="formulario"> Nombre: <input name="nombre"> &nbsp; Apellidos: <input name="apellidos"><br> <br> Contrase&ntilde;a: <input name="contrasena" type="password"><br> <br> <br> Nivel de estudios:<br> <input checked="checked" name="estudios" value="iniciales" type="radio">Iniciales.<br> <input name="estudios" value="basicos" type="radio">Basicos.<br> <input name="estudios" value="superiores" type="radio">Superiores.<br> Aficiones:<br> <input checked="checked" name="musica" type="checkbox">musica<br> <input name="lectura" type="checkbox">lectura<br> <input name="pintura" type="checkbox">pintura<br> <input name="deporte" type="checkbox">deporte<br> Sistema operativos que usas:&nbsp; <select name="so"> <option>linux</option> <option>windows</option> <option>ambos</option> </select> <br> Observaciones:<br> <textarea cols="70" rows="5" name="observacion"></textarea><br> <br> <input value="Enviar" name="envio" type="submit">&nbsp; <input name="borrar" value="Borrar" type="reset"> </form> </body> </html>