Please enable JavaScript.
Coggle requires JavaScript to display documents.
conceptos básicos html y javascript segunda parte - Coggle Diagram
conceptos básicos html y javascript segunda parte
tablas
Qué son y para qué sirven.
Anchos (Pixels Vs. Porcentajes)
Tablas Irregulares (Atributos colspan y rowspan)
Tablas anidadas
Prioridades en los formatos
Atributos de las Celdas y Filas
Atributos de las Tablas
Hipervínculos
¿Qué es un hipervínculo?
Ubicación y rutas de documentos.
Rutas Absolutas
Rutas Relativas
Rutas relativas a la raíz del sitio
Vínculos a otras páginas. Etiqueta <A>.
Uso del atributo target (Destino).
Anclaje de nombre. Atributo name.
Comportamientos del Navegador ante distintos tipos de archivos enlazados.
Imagen
Elemento <IMG>
¿Qué imágenes se pueden usar?
Ventajas y desventajas de cada formato.
Imágenes e Hipervínculos
formularios
¿Para qué sirven?
Elementos para Formularios
Campos de Texto
Casillas de Verificación
Botones de opción
Menús
Botones
Campos ocultos
Campos de carga de archivos
¿Cómo se envía la información?
¿Se pueden validar los Campos?
estilos CSS
CSS permite separar el contenido de un documento de su presentación.
ventajas
Estandarizar la presentación de un sitio web completo. Haciendola fácil de mantener.
Diferentes usuarios pueden contar con diferentes estilos acordes a sus necesidades. Ejemplos:
Estilos para personas con dificultades visuales,
Estilos para dispositivos móviles,
Estilos para dispositivos monocromos,
Estilos para impresión,
Etc.
Los documentos HTML se reducen en tamaño y complejidad.
formatos css
Propiedades de fuentes
Propiedades de color y fondo
Propiedades de texto
espaciado de palabras
alineación
Propiedades de caja
Margen
Borde
Relleno
Estilos de listas
estilos
Una hoja de estilos consiste en un conjunto de reglas.
Cada regla esta formada por:
El Selector (nombre del estilo)
La Declaración (define el estilo)
Propiedad
Valor
¿Qué podemos hacer con los estilos?
Redefinir estilos de Etiquetas HTML.
Crear Estilos Personalizados para uso genérico (Clases)
Crear Estilos para un elemento HTML específico (por Id)
Inline Styles Utilizando el atributo “style” se define el estilo de un elemento HTML en forma individual.
Embedded Style Se define la regla CSS dentro de un documento HTML. Se puede aplicar a cualquier elemento de ese documento.
Hojas de Estilos externas Un archivo CSS independiente que se encuentra referenciado en cada uno de los documentos HTML que desean utilizarlo.
Javascript
Creado por Brendan Eich para Netscapa aparece en Netscape 2.0B3 en 1995.
Es un lenguaje de programación interpretado con base en la sintaxis del lenguaje C.
Está basado en objetos y guiado por eventos.
No tiene nada que ver con Java
Las funciones Javascript se incluyen en los documentos HTML interactuando con el DOM (Document Object Model) de la página para realizar tareas no factibles de hacer con HTML sólo.
DOM: Es una interface (independiente del lenguaje) que permite a los scripts acceder dinámicamente y actualizar el contenido, la estructura y el estilo de los documentos
Capacidades
Algunas de las cosas que se pueden hacer con Javascript:
Abrir nuevas ventanas controlando su tamaño, look & feel, controles, etc.
Incorporar validaciones a los formularios.
Cambios de imágenes al colocar el mouse sobre algún objeto de la página web.
Generar respuestas ante distintos eventos
Efectos visuales en la página.
Crear, Eliminar o cambiar atributos de elementos de una página HTML en forma dinámica.
Crear o Leer Cookies
Detectar la configuración del Browser.
donde incluir javascript
En general se utiliza el elemento script
Las funciones Javascript pueden estar en archivos independientes. Por ejemplo:
<script language="JavaScript" src ="archivo.js"> </script>
También se pueden incluir las instrucciones dentro del elemento Script. Por ejemplo:
<script language="JavaScript" type="text/JavaScript">
<!--
function AbroVentana (URL,nombre,features) { //Esto es un comentario
window.open(URL,nombre,features);
}
//-->
</script>
El código Javascript también se puede incluir directamente en un evento asociado a algún elemento del documento. Por ejemplo:
<input type=“button" onclick="alert(‘Gracias por su click');return false;" value="Click">
el futuro
XHTML (Extensive Hyper Text MarkUp Language)
Es la versión XML de HTML
Tiene las mismas funciones que el HTML pero con una sintáxis más estricta (como el XML).
Surge para facilitar el acceso a la web de nuevos dispositivos (Por ejemplo: dispositivos móviles).
La sintaxis más estricta obliga a un formato correcto, liberando a los navegadores de “tratar de interpretar” documentos mal creados, lo que hace más rápida la carga de documentos bien hechos.