HTML II Etiquetas en el Cuerpo (BODY) Imágenes - Links Formularios Introducción a CSS Introducción a Javascript Introducción a PHP Estructura Básica <html> <head> <title>Html Basico </title> </head> <body> </body> </html> Código para Fotos <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen. Por ejemplo: <img src="baby.jpg"> Es conveniente, por accesibilidad, poner un atributo alt="texto alternativo". Referencias con fotos tomadas del internet: <img src="?" alt=”descripcion” align=”right”> ? = http://www.uprm.edu/cti/media/mainbn.jpg Links: <a href=”http://www.uprm.edu”> <img src=”?”> </a> Algunos Atributos del BODY Backgound - Bgcolor - Text - Link - Vlink - Alink Protección para Fotos y Texto <body ondragstart="return false" onselectstart="return false" oncontextmenu="return false"> Formularios Los formularios son posiblemente la herramienta más utilizada en Internet para obtener datos e información acerca de la gente que navega nuestro sitio. La idea de los formularios es recolectar información online y luego ejecutar una determinada acción con la misma ... Form Action <form> y </form> Algunos Atributos: Action = URL, METHOD = GET o POST <form action=”contactus.php” method=”post” name=”forma” onsubmit=”return validate()”> Etiquetas INPUT La etiqueta <INPUT> es la segunda etiqueta más importante de los formularios. Se la puede definir como una etiqueta multifunción, ya que con la misma podemos crear "push buttons", "radio buttons", "check boxes". Algunos Atributos: NAME, ALIGN, CHECKED, MAXLENGTH, SIZE, VALUE, TYPE= TEXT, PASSWORD, CHECKBOX, RADIO, SUBMIT, RESET, HIDDEN; Etiquetas para Formularios Cajas de Texto: <input type=”text” name=”nombre” maxlength=”25” value=””> Radio Buttons: <input type=”radio” name=”sexo” value=”masculino”> CheckBoxes: <input type=”checkbox” name=”sistema1” value=”windows”> Text Area: <textarea name=”asunto” cols=”20” rows=”6”></textarea> Etiquetas para Formularios Listas: <select name="edad" size="1"> <option value="0">Escoga uno...</option> <option value="1 - 10 años">1 - 10 a&ntilde;os</option> <option value="11 - 30 años">11 - 30 a&ntilde;os</option> <option value="31 años en adelante"> 31 a&ntilde;os en adelante</option> </select> Botones Botón de SUBMIT : <input type="submit" name="btenviar" value="Enviar" /> Botón de RESET: <input type="reset" value=”reset” /> Introducción a CSS Añada en el HEAD: <style type="text/css" media="screen"> ... css samples ... </style> Llamada a CSS Externo: <link rel="stylesheet" type="text/css" href="css/local.css" media="all"> Etiquetas más usadas: <div class="font1"> Hello World! </div> <span class="font1"> frase o palabra, inline text </span> <p class="font1"> hello </p> Ejemplos de CSS .font1 { color: blue; font-size: 15px; font-family: verdana; } body {! background-color: #FFFF99; } Links: a:hover { color: green; text-decoration: none; } Bordes: .borde { border: solid 3px #666; background-color: white; } Introducción a Javascript <script type=”text/javascript>: incrusta un script en la página y se cierra con </script>. Ejemplo para validar caja de texto email: <script type="text/javascript"> function validate() { frm = document.forma; if((frm.email.value == "") || (frm.email.value.indexOf("@") == -1)){ alert("Por favor incluya una dirección de correo electrónico válida"); frm.email.focus(); return false; } return true; } </script> Introducción a PHP:MAIL Subir el formulario por FTP/SFTP al Server Varibales Usadas: $nombre = $_POST['nombre']; <?php ... código ... ?> Función para Mail mail(“myemail”, “subject”, $msg, “From: $email\n”);