SlideShare una empresa de Scribd logo
1 de 6
HTML 5 Y CSS
    Antes de empezar a crear nuestra página es importante saber
          algunos Tags utilizados para realizar páginas web
           Estos tags son los que principalmente se utilizan
                    <HTML> inicio del documento
                    <HEAD> inicio de la cabecera
                        <TITLE> inicio del titulo
                        </TITLE> final del titulo
                    </HEAD> final de la cabecera
                     <BODY> inicio de la página
  Comandos HTML para ubicar los elementos de la página como
                      texto, imágenes, tablas, etc.
                           Tamaños de letras
                     <h1> tamaño de letra grande
                    <h2> tamaño de letra mediana
                 <h3> tamaño de letra más pequeño
         Y así sucesivamente con <h4> <h5> <h6> <h7>
         <ul> sirve para hacer un listado no ordenado</ul>
      <ol> este sirve para hacer un listado ya ordenado</ol>
<table> se lo emplea para realizar tablas</table>               en el
  se encuentran el <tr>que sirve para hacer las filas y el <td> las
                                columnas
 <img> sirve para colocar imágenes en el tenemos que escribir el
             lugar donde se encuentra la imagen ejemplo
    <img src ="/img para blog/akiyama.png"> el src es una
   característica especial que siempre debe colocarse seguido del
   igual y entre comillas las carpeta en que se encuentran en este
 caso img para blog seguido de un / y luego colocar el nombre con
  el cual se encuentra la imagen un punto y el formato en que se
                               encuentra
     <br> es un tag que sirve para saltar espacios y este no hay
                         necesidad de cerrarlo
                     </BODY> final de la pagina
                    </HTML> final del documento
De esta forma ya conociendo estos tags vamos organizando
nuestra página web, de tal manera que nos quedara de la siguiente
                             manera


Primero que todo empezamos creando una carpeta en el lugar que
  tú quieras llamada HTML, y dentro de esta una que diga CSS y
dentro de esta una que diga IMAGENES en las que vas a meter las
          imágenes que quieres colocar en la página web




Y luego dando clic izquierdo seleccionamos nuevo y documento de
                               texto




Al que lo llamaremos index.html, ya que cualquier servidor entiende
                          index siempre
Posteriormente pasamos a abrir Notepad++ Para iniciar con la
creación de nuestra página web abriendo el documento de texto al
                    que llamamos index.html




Lo primero que se va hacer en la estructura de un documento html
         es teclear siempre al inicio <!DOCTYPE HTML>




Y visto los anteriores tags, vamos organizando nuestra página web
         de tal forma que nos quede de la siguiente manera
Y al ejecutarlo lo podemos ejecutar en cualquier servidor




   De tal manera que nuestra página web queda así
Gracias

Más contenido relacionado

La actualidad más candente (17)

Pajinas web html 5 para suvi hoy
Pajinas web html 5 para suvi hoyPajinas web html 5 para suvi hoy
Pajinas web html 5 para suvi hoy
 
Html
HtmlHtml
Html
 
Partes de una web
Partes de una webPartes de una web
Partes de una web
 
Proceso de desarrollo java script
Proceso de desarrollo java scriptProceso de desarrollo java script
Proceso de desarrollo java script
 
Producto 3
Producto 3Producto 3
Producto 3
 
Etiquetas de código html
Etiquetas de código htmlEtiquetas de código html
Etiquetas de código html
 
Examen 1ra U
Examen 1ra UExamen 1ra U
Examen 1ra U
 
Paso de creacion de sitio web en dreamweaver
Paso de creacion de sitio web en dreamweaverPaso de creacion de sitio web en dreamweaver
Paso de creacion de sitio web en dreamweaver
 
Documento nicolas garibello
Documento nicolas garibelloDocumento nicolas garibello
Documento nicolas garibello
 
Pagina a html
Pagina a htmlPagina a html
Pagina a html
 
Estructura de página web con html 5
Estructura de página web con html 5Estructura de página web con html 5
Estructura de página web con html 5
 
Html5 y php5
Html5 y php5Html5 y php5
Html5 y php5
 
Etiquetas para estructurar texto en HTML - 3 parte
Etiquetas para estructurar texto en HTML - 3 parteEtiquetas para estructurar texto en HTML - 3 parte
Etiquetas para estructurar texto en HTML - 3 parte
 
Etiquetas html
Etiquetas htmlEtiquetas html
Etiquetas html
 
Colegio nacional nicolas esguerra (1)
Colegio nacional nicolas esguerra (1)Colegio nacional nicolas esguerra (1)
Colegio nacional nicolas esguerra (1)
 
Pagina web
Pagina webPagina web
Pagina web
 
Mi primer pagina web
Mi primer pagina webMi primer pagina web
Mi primer pagina web
 

Similar a Html 5 y css

Codigos HTML...paginas web
Codigos HTML...paginas webCodigos HTML...paginas web
Codigos HTML...paginas web
ABel Palma
 
Página web en html 5 y doctype
Página web  en html 5  y doctypePágina web  en html 5  y doctype
Página web en html 5 y doctype
Viviana Bebitha
 
Clase 1 - Introducción HTML.pptx
Clase 1 - Introducción HTML.pptxClase 1 - Introducción HTML.pptx
Clase 1 - Introducción HTML.pptx
jusl1
 

Similar a Html 5 y css (20)

Pagina web html5
Pagina web html5Pagina web html5
Pagina web html5
 
Etiquetas básicas de HTML
Etiquetas básicas de HTMLEtiquetas básicas de HTML
Etiquetas básicas de HTML
 
Codigos HTML...paginas web
Codigos HTML...paginas webCodigos HTML...paginas web
Codigos HTML...paginas web
 
Mi primera pagina web en html con bloc de notas
Mi primera pagina web en html con bloc de notasMi primera pagina web en html con bloc de notas
Mi primera pagina web en html con bloc de notas
 
Directivas en html
Directivas en htmlDirectivas en html
Directivas en html
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 
Codigo html
Codigo htmlCodigo html
Codigo html
 
Producto 3
Producto 3Producto 3
Producto 3
 
Producto 3
Producto 3Producto 3
Producto 3
 
Etiquetas básicas-en-html
Etiquetas básicas-en-htmlEtiquetas básicas-en-html
Etiquetas básicas-en-html
 
Clase 2 Desarrollo Web
Clase 2 Desarrollo Web Clase 2 Desarrollo Web
Clase 2 Desarrollo Web
 
Página web en html 5 y doctype
Página web  en html 5  y doctypePágina web  en html 5  y doctype
Página web en html 5 y doctype
 
HTML.pdf
HTML.pdfHTML.pdf
HTML.pdf
 
Karina
KarinaKarina
Karina
 
Códigos HTML Sede magdalena ortega de Nariño
Códigos HTML Sede magdalena ortega  de NariñoCódigos HTML Sede magdalena ortega  de Nariño
Códigos HTML Sede magdalena ortega de Nariño
 
Html
HtmlHtml
Html
 
Clase 1 - Introducción HTML.pptx
Clase 1 - Introducción HTML.pptxClase 1 - Introducción HTML.pptx
Clase 1 - Introducción HTML.pptx
 
Presentacinhtml 091121100213-phpapp02
Presentacinhtml 091121100213-phpapp02Presentacinhtml 091121100213-phpapp02
Presentacinhtml 091121100213-phpapp02
 
Escuela Abierta - Taller de Html
Escuela Abierta - Taller de HtmlEscuela Abierta - Taller de Html
Escuela Abierta - Taller de Html
 
Html tutorial
Html tutorialHtml tutorial
Html tutorial
 

Más de Ktziitha Lendaa

Más de Ktziitha Lendaa (20)

Pagina para subir
Pagina para subirPagina para subir
Pagina para subir
 
Presentación2
Presentación2Presentación2
Presentación2
 
Presentación2
Presentación2Presentación2
Presentación2
 
Presentación2
Presentación2Presentación2
Presentación2
 
Degradados
DegradadosDegradados
Degradados
 
3 sprite
3 sprite 3 sprite
3 sprite
 
2 creación de figuras utilizando código
2 creación de figuras utilizando código2 creación de figuras utilizando código
2 creación de figuras utilizando código
 
1 sintesis de la funcion
1 sintesis de la funcion1 sintesis de la funcion
1 sintesis de la funcion
 
Formularios en html555
Formularios en html555Formularios en html555
Formularios en html555
 
3kt continuacion de la 2forma de clic d epelicula
3kt continuacion de la 2forma de clic d epelicula3kt continuacion de la 2forma de clic d epelicula
3kt continuacion de la 2forma de clic d epelicula
 
2 kt clips de película
2 kt clips de película2 kt clips de película
2 kt clips de película
 
1 kt fundamentales de as
1 kt fundamentales de as1 kt fundamentales de as
1 kt fundamentales de as
 
Condicionales
CondicionalesCondicionales
Condicionales
 
Kt condicionales en php
Kt condicionales en phpKt condicionales en php
Kt condicionales en php
 
Puertos pc
Puertos pcPuertos pc
Puertos pc
 
Segunda parte
Segunda parteSegunda parte
Segunda parte
 
Para hacer actionscrip
Para hacer actionscrip Para hacer actionscrip
Para hacer actionscrip
 
Paisaje de flash
Paisaje de flashPaisaje de flash
Paisaje de flash
 
2da pagina web con html5 y doctype
2da pagina web con html5 y doctype2da pagina web con html5 y doctype
2da pagina web con html5 y doctype
 
Objetos agrupados y no agrupados
Objetos agrupados y no agrupadosObjetos agrupados y no agrupados
Objetos agrupados y no agrupados
 

Html 5 y css

  • 1. HTML 5 Y CSS Antes de empezar a crear nuestra página es importante saber algunos Tags utilizados para realizar páginas web Estos tags son los que principalmente se utilizan <HTML> inicio del documento <HEAD> inicio de la cabecera <TITLE> inicio del titulo </TITLE> final del titulo </HEAD> final de la cabecera <BODY> inicio de la página Comandos HTML para ubicar los elementos de la página como texto, imágenes, tablas, etc. Tamaños de letras <h1> tamaño de letra grande <h2> tamaño de letra mediana <h3> tamaño de letra más pequeño Y así sucesivamente con <h4> <h5> <h6> <h7> <ul> sirve para hacer un listado no ordenado</ul> <ol> este sirve para hacer un listado ya ordenado</ol> <table> se lo emplea para realizar tablas</table> en el se encuentran el <tr>que sirve para hacer las filas y el <td> las columnas <img> sirve para colocar imágenes en el tenemos que escribir el lugar donde se encuentra la imagen ejemplo <img src ="/img para blog/akiyama.png"> el src es una característica especial que siempre debe colocarse seguido del igual y entre comillas las carpeta en que se encuentran en este caso img para blog seguido de un / y luego colocar el nombre con el cual se encuentra la imagen un punto y el formato en que se encuentra <br> es un tag que sirve para saltar espacios y este no hay necesidad de cerrarlo </BODY> final de la pagina </HTML> final del documento
  • 2. De esta forma ya conociendo estos tags vamos organizando nuestra página web, de tal manera que nos quedara de la siguiente manera Primero que todo empezamos creando una carpeta en el lugar que tú quieras llamada HTML, y dentro de esta una que diga CSS y dentro de esta una que diga IMAGENES en las que vas a meter las imágenes que quieres colocar en la página web Y luego dando clic izquierdo seleccionamos nuevo y documento de texto Al que lo llamaremos index.html, ya que cualquier servidor entiende index siempre
  • 3. Posteriormente pasamos a abrir Notepad++ Para iniciar con la creación de nuestra página web abriendo el documento de texto al que llamamos index.html Lo primero que se va hacer en la estructura de un documento html es teclear siempre al inicio <!DOCTYPE HTML> Y visto los anteriores tags, vamos organizando nuestra página web de tal forma que nos quede de la siguiente manera
  • 4.
  • 5. Y al ejecutarlo lo podemos ejecutar en cualquier servidor De tal manera que nuestra página web queda así