0% encontró este documento útil (0 votos)
69 vistas29 páginas

Guía Básica de HTML5 y CSS3

HTML es un lenguaje que define la estructura y semántica de las páginas web mediante etiquetas. Existen etiquetas con apertura y cierre y etiquetas vacías. La estructura básica de una página web incluye las etiquetas <!DOCTYPE>, <html>, <head> y <body>. Las etiquetas básicas permiten crear párrafos, listas, encabezados y más. CSS es un lenguaje que permite aplicar estilos como colores, fuentes y texto a los elementos HTML mediante selectores como clases y

Cargado por

Jose Salazar
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
0% encontró este documento útil (0 votos)
69 vistas29 páginas

Guía Básica de HTML5 y CSS3

HTML es un lenguaje que define la estructura y semántica de las páginas web mediante etiquetas. Existen etiquetas con apertura y cierre y etiquetas vacías. La estructura básica de una página web incluye las etiquetas <!DOCTYPE>, <html>, <head> y <body>. Las etiquetas básicas permiten crear párrafos, listas, encabezados y más. CSS es un lenguaje que permite aplicar estilos como colores, fuentes y texto a los elementos HTML mediante selectores como clases y

Cargado por

Jose Salazar
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd

HTML & CSS

Profesor Erick Bran


HTML5
Es un lenguaje de que sirve para
definir la estructura y la
semántica de nuestra página web
1. Etiquetas
Existen más de 100 elementos que nos permitirán crear etiquetas.
Pero solo hay de dos tipos

Las que tienen una apertura y un cierre Las que se cierran en la misma etiqueta, también
conocidas como "etiquetas vacías" o "autocontenidas".
Estructura básica de una
PÁGINA WEB
<!DOCTYPE html>
Indica al navegador
que la versión HTML
será la 5 (HTML5).
<html> Indica la raiz del
documento, todo el
resto de etiquetas se
encuentra adentro.
Ademas especifica el
idioma en el cual esta
escrita.

</html> <html lang="es">


<head>

Envuelve información principalmente a:


el navegador, buscadores y otras paginas.

No se muestra en la pagina web.

</head>
Indica al navegador
<meta
que tipo de caracteres
charset="UTF-8"> contiene la pagina.
Indica el titulo de nuestra pagina.

Se muestra en la pestaña del navegador.

<title> Mi primera página web </title>


<body>

Dentro de esta etiqueta está todo el


contenido visible para el usuario.

</body>
¿Cuáles son
las etiquetas
básicas?
Etiquetas básicas

<p> </p>: párrafo.

<br>: salto de línea.

<hr>: salto de línea con una línea visual.


Etiquetas básicas

<h1></h1>: encabezado de pagina.


Tiene de 1 – 6 subniveles.

<ul></ul>: lista de elementos, no importa


el orden.

<ol></ol>: lista de elementos, si importa


el orden.
Etiquetas básicas

<li></li>: elemento de lista


siempre va con <ol> o <ul>.

<strong></strong>: importante.

<em></em>: enfatiza.
Etiquetas básicas

<!-- -->: comentario.

<footer></footer>: indica al navegador el


pie de página.

<article></article>: indica un artículo.


Etiquetas básicas

<cite></cite>: si se enfatiza en
una frase, esta sirve para indica
el autor.

Y muchas más...
CSS3
Es un lenguaje de marcado que
permite aplicar estilos a
nuestros elementos HTML.
Selectores
Selecciona todos los
elementos que contendrá

Universal la pagina.

*{
propiedad:valor;
}
Sirve para dar estilo sólo a
determinados elementos
marcados con el atributo
Clase class y la clase definida.

.nombreClase{
propiedad:valor;
}
Este se utiliza para marcar
un elemento único.
ID
#nombreID{
propiedad:valor;
}
Modificación de colores

RGB: red, green, blue.

#: hexadecimal.

RGBA: red, green, blue, alpha.


Modificación de fuente

font-size: tamaño.

font-style: estilo.

font-family: lista de fuentes.


Modificación de texto

text-align: alinear.

text-decoration: subrayado, tachado, etc.

text-height: ajuste de interlineado.


Curso:

clic sobre mí

También podría gustarte