Preview only show first 10 pages with watermark. For full document please download

3. Html5 - Avanzado

   EMBED

Share

Transcript

HTML5 AVANZADO 1.Tablas
Permiten mostrar datos en forma ordenada, en filas y columnas. Para la creación de una tabla intervienen: • • •  Es la marca de comienzo de la tabla.
 Es  Es  Es la marca de comienzo de una fila.
 Es  Es la marca de comienzo de una celda. Tablas
< >27,5 %
>Chrome Chrome< >50,3 % >Explorer  >Firefox Firefox< >20,5 %
> 2.Tablas con Título
Para indicar que se trata de una fila de títulos utilizamos el elemento  en  en lugar de .. El navegador resalta los títulos del resto de la tabla. Una vez que utilicemos CSS CSS,, visualmente será más atractivo. Tablas con Título
< >< >
>Navegador  >P orcentaje >Chrome Chrome< >< td> td >50,3 % >Explorer  >27, 5 % >Firefox Firefox< > >20,5 %
> 3.Caracteres especiales  Algunos caracteres no se pueden pueden mostrar, ya que el navegador los confundiria con las marcas HTML HTML.. La solución es utilizar otra sintaxis: < > & " Espacio en blanco   < > & " Para indicar que el sitio tendrá acentos y ñ: Caracteres especiales

10+x*y < < 12*z  12*z

4.Formularios
Un formulario permite cargar datos al servidor. Es el medio ideal para registrar datos, solicitar productos, sacar turnos etc. El lenguaje HTML solo tiene el objetivo de crear el formulario. Para guardar los datos, es necesario utilizar un lenguaje que se ejecute en el servidor (PHP, ASP, JSP, Python, etc.) Formularios > Ingrese su nombre:< nombre:< > Ingrese su fecha de nacimiento: nacimiento:< < > > Formularios
Ingrese su nombre: es un texto fijo. Es un cuadro de texto. name=nombre Es la variable que será enviada. Es el botón para enviar. 5.Formularios Campo input  nos permite definir cuadros de texto, fechas,  nos números, claves, botones, etc. Usuario:
Clave:
5. Formularios Campo input
Elegir Color:
type=submit> Formularios Campo input
Edad:
Hora:
type=submit> Parámetros: readonly, value • • Si definimos la propiedad readonly readonly a  a un  el  el mismo será de solo lectura. Si definimos la propiedad value value a  a un  el  el mismo tendrá un valor por defecto. 7. Area de Texto 7. Area de Texto
Firma:

8. Checkbox Un checkbox es una casilla de selección que puede tomar dos valores (seleccionado/no seleccionado). Se utiliza dentro de los formularios. Veamos la sintaxis para definir controles de formulario de tipo checkbox: Seleccione sus operadoras:
Claro
 name=claro>
Personal< name=personal>
br> Tigo

> 8. Checkbox >Seleccione una o varias:< > >claro< claro >vox< vox >tigo< tigo > 9. Radio Cuando tenemos un conjunto de opciones pero solo una puede ser seleccionada debemos emplear controles visuales de tipo radio. Para definir controles de tipo radio también utilizamos el elemento input inicializando la propiedad type con el valor "radio" 9. Radio ¿Cuánto sabe de informática? Nada
Poco
Poco
> Mucho
value=3>Mucho
Como podemos observar todos tienen el mismo valor en la propiedad name name.. Cuando seleccionamos uno se desmarca el anterior. El valor que se rescata en el servidor es el dato almacenado en la propiedad value. 9. Radio ¿Cuánto sabe de informática?
Nada
Poco
value=2>Poco
Mucho
value=3>Mucho
El elemento select es un cuadro de selección. Nos permite seleccionar una opción entre un conjunto de muchos valores. Podemos seleccionar varias opciones.
>Seleccione su país:< país:< > > Ejercicios https://docs.google.com/forms/d/1PuWv_t1flnKVPc https://docs.google.com/forms/d/1PuW v_t1flnKVPcKNfpPKat KNfpPKat hG7yuDkLLnN7r-3fBlTQc/viewform