PAGINAS WEB 4TA. CLASE

Luis Rojas

Recordemos apagar/silenciar nuestros teléfonos móviles.

Tablas sin bordes http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_tables3

Encabezados de tabla http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_table_headers

Etiquetas dentro de una tabla http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_table_elements

Espaciado de celdas

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_table_cellpadding

Espaciado del Borde http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_table_cellspacing

Listas http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_lists4

Listas ordenadas http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_lists

Variedad de listas ordenadas

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_lists_ordered

Variedad de listas sin orden http://www.w3schools.com/html/tryit.asp?filen

ame=tryhtml_lists_unordered

Variedad de listas con orden http://

www.w3schools.com/html/tryit.asp?filename=tryhtml_lists_ordered

Listas anidadas

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_lists2

Recepción de Datos

Textos http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_input

Usuario y contraseña

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_inputpassword

Checkboxes http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_checkbox

Selección única

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_radio

Listas de elección http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_select2

Áreas de texto

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_textarea

Botón http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_button

Encabezados http://www.w3schools.com/html/tryit.asp

?filename=tryhtml_title

Meta tags

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_meta

Meta tag descripcion del sitio y keywords

www.w3schools.com/html/tryit.asp?filename=tryhtml_keywords

Div

<div> </div>

Alta en google https://www.google.com/webmasters/too

ls/submit-url?hl=es

CSS

Hojas de Estilo en Cascada

Sintáxis básica: Nombre_de_Etiqueta { Instruccion_css: valor ; }

CSS

Ejemplo

body { color:red; } h1 { Color : red; }

Introducción a los estilos CSS http://

www.w3schools.com/css/tryit.asp?filename=trycss_background-color_body

Estilos en un archivo externo

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_link

Colores para CSS (hexadecimal)

http://www.colorpicker.com/

Clases CSS

Tipo 1 (clase para un solo tipo de etiqueta)

p.azul{ color: blue; } p.rojo{ color: red; }

<p class="first">This is a paragraph that uses the p.first CSS code!</p>

<p class="second">This is a paragraph that uses the p.second CSS code!</p>

Clases CSS

Tipo 2 (clase para varios tipos de etiqueta) .center { text-align:center; }

<h1 class="center">Center-aligned heading</h1>

<p class="center">Center-aligned paragraph.</p>

Color de fondo http://www.w3schools.com/css/tryit.asp?f

ilename=trycss_background-color_body

http://www.w3schools.com/css/tryit.asp?filename=trycss_background-color_elements

Imagen de fondo (no del todo recomendado)

http://www.w3schools.com/css/tryit.asp?filename=trycss_background-image

Por ésto:

http://www.w3schools.com/css/tryit.asp?filename=trycss_background-image_bad

Imagen que se repite de fondo http://www.w3schools.com/css/tryit.asp?f

ilename=trycss_background-image_gradient2

Imagen