Alejandro Caballero Daza Juan Camilo Arévalo Arboleda

Atributos globales HTML5 AccesskeyContenteditableSpellcheckContextmenu Alejandro Caballero - Camilo Arévalo | HTML5 y CSS32

Accesskey Especifica una tecla de acceso directo para activar / enfocar un elemento. GOOGLE ChromeExplorerFirefoxSafariOpera si Alejandro Caballero - Camilo Arévalo | HTML5 y CSS33

Contenteditable Especifica si el contenido de un elemento es editable o no. Este es un párrafo editable ChromeExplorerFirefoxSafariOpera Alejandro Caballero - Camilo Arévalo | HTML5 y CSS34

Contextmenu Especifica el menú contextual de un elemento. El menú contextual aparece cuando un usuario hace clic en el elemento. Este párrafo tiene un menú contextual llamado "menu" ChromeExplorerFirefoxSafariOpera no sino Alejandro Caballero - Camilo Arévalo | HTML5 y CSS35

Spellcheck Especifica si el elemento ha de tener su ortografía y gramática marcada o no. Párrafo para editar con revisión ChromeExplorerFirefoxSafariOpera Alejandro Caballero - Camilo Arévalo | HTML5 y CSS36

Eventos de ventana OnafterprintOnbeforeprintOnbeforeonloadOnofflineOnonlineOnforminputOninvalid Alejandro Caballero - Camilo Arévalo | HTML5 y CSS37

Onafterprint Ejecuta un JavaScript cuando la página empieza a imprimir, o si el diálogo de impresión se ha cerrado. ChromeExplorerFirefoxSafariOpera NoSi No Alejandro Caballero - Camilo Arévalo | HTML5 y CSS38

Onbeforeprint Ejecuta un JavaScript cuando la página esta a punto de imprimir o mostrar un dialogo de impresión. ChromeExplorerFirefoxSafariOpera NoSi No Alejandro Caballero - Camilo Arévalo | HTML5 y CSS39

Onbeforeunload Ejecuta un JavaScript cuando la página esta apunto de hacer una descarga. ChromeExplorerFirefoxSafariOpera Si 15.0 Alejandro Caballero - Camilo Arévalo | HTML5 y CSS310

Onoffline Ejecuta un JavaScript cuando el navegador inicia a trabajar fuera de línea. ChromeExplorerFirefoxSafariOpera No 3.0No Alejandro Caballero - Camilo Arévalo | HTML5 y CSS311

Ononline Ejecuta un JavaScript cuando tu navegador esta trabajando en línea. ChromeExplorerFirefoxSafariOpera No 3.0No Alejandro Caballero - Camilo Arévalo | HTML5 y CSS312

Onforminput Ejecuta un JavaScript cuando el usuario escribe en un campo. ChromeExplorerFirefoxSafariOpera Si 13Alejandro Caballero - Camilo Arévalo | HTML5 y CSS3

Oninvalid Ejecuta un JavaScript cuando la entrada falla. ChromeExplorerFirefoxSafariOpera Si10,0SiNoSi Alejandro Caballero - Camilo Arévalo | HTML5 y CSS314

Html5 appi HTML geolocationHTML drag and dropHTML local storageHTML applicaction cacheHTML youtube videos Alejandro Caballero - Camilo Arévalo | HTML5 y CSS315

Geolocation La api de geolocalización en HTML es usada para obtener la posición del usuario. Ejemplo Alejandro Caballero - Camilo Arévalo | HTML5 y CSS316 ChromeExplorerFirefoxSafariOpera

Drag and drop En HTML es una característica muy común, funciona agarrando un objeto y arrastrarlo a una ubicación diferente y luego soltarlo. Ejemplo Alejandro Caballero - Camilo Arévalo | HTML5 y CSS317 ChromeExplorerFirefoxSafariOpera

Local storage La api de local storage en HTML permite a las aplicaciones web almacenar datos localmente en el navegador del usuario. Ejemplo Alejandro Caballero - Camilo Arévalo | HTML5 y CSS318 ChromeExplorerFirefoxSafariOpera

Application cache HTML introduce caché application para poder almacenar una aplicación web en cache y poder acceder sin conexión a internet. Ejemplo Alejandro Caballero - Camilo Arévalo | HTML5 y CSS319 ChromeExplorerFirefoxSafariOpera

YouTube videos Una forma fácil de reproducir videos de YouTube en HTML. Ejemplo Alejandro Caballero - Camilo Arévalo | HTML5 y CSS320 ChromeExplorerFirefoxSafariOpera Si si

CSS3 Modulosborder-radiusTextWeb FontsTransitionsAnimationsMulti-column Layout Alejandro Caballero - Camilo Arévalo | HTML5 y CSS321

Modulos En CSS3, la especificación se dividió en una colección de especificaciones más pequeñas, conocidas como módulos. Alejandro Caballero - Camilo Arévalo | HTML5 y CSS322

Border-radius Agrega un borde de n pixels a una división. div { border: 2px solid; border-radius: 25px; } ChromeExplorerFirefoxSafariOpera Alejandro Caballero - Camilo Arévalo | HTML5 y CSS323

Text Color HEXRGBNombre Text-align Text- decoration Text- transform Text- indent Alejandro Caballero - Camilo Arévalo | HTML5 y CSS324 Por medio de CSS3 se puede dar atributos a las etiquetas tipo texto de HTML, tales como:

Ejemplo p { color: #00ff00; } h1 { text-align: center; } h1 { text- decoration: overline; } p { text- transform: uppercase; } p { text-indent: 50px; } Alejandro Caballero - Camilo Arévalo | HTML5 y CSS325

Text PropiedadExplorerChormeFirefoxSafariOpera text- overflow word-wrap word-break Alejandro Caballero - Camilo Arévalo | HTML5 y CSS326

Ejemplo p { text- overflow: ellipsis; } p { word-wrap: break- word; } p { word-break: break- all; } Alejandro Caballero - Camilo Arévalo | HTML5 y CSS327

WEB FONTS En CSS3 existen propiedades de fuente que definen la familia como tipo de fuente, el tamaño y el estilo de un texto. ChromeExplorerFirefoxSafariOpera Alejandro Caballero - Camilo Arévalo | HTML5 y CSS328

Ejemplo Font-family div { Font- family: NameFont; } Font-style div { font- style: italic; } Font-weight div { font- weight: bold; } Alejandro Caballero - Camilo Arévalo | HTML5 y CSS329

Transitions Las transiciones permiten cambiar los valores de propiedad durante un periodo cuando el cursor pasa por el área a modificar. div { width: 100px; height: 100px; background: red; -webkit-transition: width 2s; /* Safari */ transition: width 2s; } Alejandro Caballero - Camilo Arévalo | HTML5 y CSS330

Animations Permite hacer animaciones en la mayoría de los elementos sin necesidad de utilizar JavaScript o flash. Alejandro Caballero - Camilo Arévalo | HTML5 y example { from {background-color: red;} to {background-color: yellow;} } div { width: 100px; height: 100px; background-color: red; -webkit-animation-name: example; transition: width 2s; -webkit-animation-duration: 4s; animation-duration: 4s; }

Multi-column layout El diseño de varias columnas extiende el diseño de bloque para permitir la fácil definición de varias columnas de texto. Alejandro Caballero - Camilo Arévalo | HTML5 y CSS332 div { -webkit-column-count: 3; /* Chrome, Safari, Opera */ -moz-column-count: 3; /* Firefox */ column-count: 3; }

Bibliobiografia     Alejandro Caballero - Camilo Arévalo | HTML5 y CSS333

Muchas gracias! Alejandro Caballero - Camilo Arévalo | HTML5 y CSS334