la magia-del-html
DESCRIPTION
Curso de HTML para niñosTRANSCRIPT
![Page 1: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/1.jpg)
Por Teresa Oliver y Fernando Val
La Magia del HTML
jueves 27 de diciembre de 12
![Page 2: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/2.jpg)
Saber Programar te da
Poderes
La Magia del HTML
jueves 27 de diciembre de 12
![Page 3: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/3.jpg)
https://webmaker.org/en-US/tools/#x-ray-goggles
La Magia del HTML
1. Poder de vista rayos-x
jueves 27 de diciembre de 12
![Page 4: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/4.jpg)
https://webmaker.org/en-US/tools/#x-ray-goggles
La Magia del HTML
2. Poder de modificar la realidad
jueves 27 de diciembre de 12
![Page 5: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/5.jpg)
https://thimble.webmaker.org/en-US/
La Magia del HTML
3. Poder de CREARCualquier cosa que imaginéis.
jueves 27 de diciembre de 12
![Page 6: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/6.jpg)
La Magia del HTML
Hay más poderesPero no los vamos a ver hoy...
jueves 27 de diciembre de 12
![Page 7: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/7.jpg)
La Magia del HTML
HTML, HTML5
<etiqueta>Contenido</etiqueta>
<etiqueta />
<etiqueta class=”attr1”/>
jueves 27 de diciembre de 12
![Page 8: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/8.jpg)
La Magia del HTML
HTML, HTML5
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Mi Web</title></head><body></body></html>
jueves 27 de diciembre de 12
![Page 9: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/9.jpg)
La Magia del HTML
HTML, HTML5
H1, h2, h3, h4 , h5, h6
p, em, strong
ul, ol, li
jueves 27 de diciembre de 12
![Page 10: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/10.jpg)
La Magia del HTML
HTML, HTML5
img<img src=”ruta-a-la-imagen.png”/>
a<a href=”ruta-del-link”/> texto visible del link</a>
jueves 27 de diciembre de 12
![Page 11: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/11.jpg)
La Magia del HTML
HTML, HTML5
span, div
header, footer, aside, nav
section, article
jueves 27 de diciembre de 12
![Page 12: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/12.jpg)
La Magia del HTML
HTML, HTML5
table,
tr, td,
th
jueves 27 de diciembre de 12
![Page 13: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/13.jpg)
La Magia del HTML
CSS, CSS3
Podemos controlar:- Tipos de letra, tamaño, etc.- Colores- Fondos- Tamaños de los elementos- Y mucho más...
jueves 27 de diciembre de 12
![Page 14: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/14.jpg)
La Magia del HTML
CSS, CSS3
Se aplica a “selectores”:
- Etiquetas HTML, “body” por ej.- Clases, class=”cabecera”- IDs, id=”pato”
jueves 27 de diciembre de 12
![Page 15: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/15.jpg)
La Magia del HTML
CSS, CSS3
body { font-family: Arial; font-weight: bold; font-size: 24px; font-style: italic;}
jueves 27 de diciembre de 12
![Page 16: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/16.jpg)
La Magia del HTML
CSS, CSS3
body { color: red; background: yellow url(“ruta-a-la-imagen.png”) top center;}
http://www.colorpicker.com/
jueves 27 de diciembre de 12
![Page 17: La magia-del-html](https://reader033.vdocumento.com/reader033/viewer/2022052400/559a0d251a28ab7e098b4622/html5/thumbnails/17.jpg)
La Magia del HTML
Proyecto libreIDEAS:- Página personal- Página de familia- Christmas- Tu afición favorita- Cuento
jueves 27 de diciembre de 12