PDF de programación - Taller de HTML, CSS, JS y Bootstrap

Imágen de pdf Taller de HTML, CSS, JS y Bootstrap

Taller de HTML, CSS, JS y Bootstrapgráfica de visualizaciones

Publicado el 20 de Octubre del 2018
274 visualizaciones desde el 20 de Octubre del 2018
1,2 MB
21 paginas
Cualquiera

puede

desarrollar
en la web

Taller de

HTML, CSS, JS
y Bootstrap

Primer ejemplo de html!!

Utilizando su editor de
confianza crearemos un
archivo llamado:

1_primer_ejemplo.html

No olvides la
extensión .html!!

Nuestras dos primeras etiquetas

¿Qué es html?

HTML, sigla en inglés de HyperText
Markup Language (lenguaje de marcas
de hipertexto)

<etiquetas> </etiquetas>

Etiquetas de encabezado

Archivo: 2_encabezados.html

Apertura y cierre
"Enseñar a los niños el uso del software
libre (en las escuelas), formará individuos
con sentido de libertad. (Richard Stallman")

"Enseñar a los niños el uso del software
libre (en las escuelas,) formará individuos
con sentido de libertad.(“Richard Stallman)

"Enseñar a los niños el uso del software
libre (en las escuelas), formará individuos
con sentido de libertad."(Richard Stallman)

Más etiquetas... Archivo: 3_etiquetas.html

¿Los espacios en blanco?
¿Los saltos de línea?

¿Cuantas etiquetas tengo que
aprender?

¿Las tildes?
¿Cómo sabe el navegador en qué
idioma está mi página web?

Continua…

https://developer.mozilla.org/es/doc
s/HTML/HTML5/HTML5_lista_elem
entos

Metadatos del documento, Scripting, Secciones,
Agrupación de Contenido, Semántica a nivel de
Texto, Contenido incrustado, Datos tabulares,
Formularios

<br>

Permite saltos de línea.
No necesita cerrarse

Estructura formal de un documento HTML5

Archivo: 4_estructura_formal_documento.html

HTML5? HTML4? XHTML? HTML2?

Español (es) Ingles (en) Frances (fr)

Aquí se coloca el título de la página (el
que aparece en las pestañas del
navegador)

Juego de caracteres que nos permite las
tildes

Contenido de la página dentro de la
etiqueta body

La etiqueta meta se usa para

especificar más información sobre la

página

¿Qué es un atributo?

Todos elementos en HTML tienen atributos;
estos son valores adicionales que configuran los
elementos.

<etiqueta atributo1 = “valor” > ... </etiqueta>

<etiqueta atributo1 = “valor” atributo2 = “valor2”> </etiqueta>

<img src="ubicacion/archivo.png" />

Etiqueta meta

<head>

<meta charset="UTF-8">

<meta name="description" content="La descripción de la página, es la que
se ve en los buscadores como google">

<meta name="keywords" content="Palabras claves del docuemento, ejemplo:
HTML,CSS,XML,JavaScript">

<meta name="author" content="Usimte">

</head>

Ejercicios
https://www.w3schools.com/html/exercise.asp?filename=exercise_paragraphs
2

https://www.w3schools.com/html/exercise.asp?filename=exercise_paragraphs
3

Estructura de archivos
Crearemos una carpeta llamada “mi_proyecto”

Dentro de esta crearemos tres carpetas llamadas: “css”, “js” e “imagenes”

Crearemos un archivo llamada “index.html”

Proyecto

Crear una página web sobre un tema del gusto del diseñador. Como deportes,
hobbies, su carrera...

Esta debe tener

1. Un juego de caracteres e idioma
2. Una hoja de estilo
3. Listas ordenadas
4. Listas no ordenadas
5. Tablas
6.
7. Links a otras páginas
8. Uso de bootstrap

Imágenes

1.

Recuerda añadir las imágenes que
quieras usar en la carpeta
“imagenes”, no olvides la extensión
de la imagen.

Añadamos
contenido

¿Cómo cambiamos el color de los
h2, el tamaño de la letra de los
párrafos?

¿Que pasa si quiero que la imagen
sea de otro tamaño?

Gracias

Preguntas del grupo
¿Que les ha parecido el curso?

¿Qué aspectos deberían mejorarse?

¿Algún comentario?
  • Links de descarga
http://lwp-l.com/pdf13961

Comentarios de: Taller de HTML, CSS, JS y Bootstrap (0)


No hay comentarios
 

Comentar...

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad