Programación avanzada etiquetas de html

1,467 views
1,259 views

Published on

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,467
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Programación avanzada etiquetas de html

  1. 1. UNIVERSIDAD TÉCNICA“LUIS VARGAS TORRES”ASIGNATURA:PROGRAMACIÓN AVANZADA IALUMNA:PEREA MOREIRA EVELYNCATEDRÁTICO:ING. STALIN FRANCIS
  2. 2. ETIQUETAS DEHTMLPROGRAMACIÓN AVANZADA I
  3. 3. ETIQUETAS DE HTMLMARCAS BÁSICAS<html> </html> <head> </head> <body> </body><title> </title> <meta>Al principio y al final detodo documento.Cabecera del documento, dentrode esta etiqueta encontramos:Indica el título de la páginas parael navegador.Permite aportar meta informaciónal documentoDentro de esta etiqueta seinsertan los contenidos deldocumento.
  4. 4. ETIQUETAS DE HTMLPROPIEDADESDE LA PÁGINA<body text = “#xxyyzz”>:Define el color por defecto deltexto en la página.<body bgcolor = “#xxyyzz”>:Define el color de fondo de lapágina.<body link = “#xxyyzz”>:Define el color de los enlaces.<body vlink = “#xxyyzz”>:Define el color de los enlacesvisitados.<body text = “#xxyyzz”>:Define el color por defecto deltexto en la página.<body alink = “#xxyyzz”>:Define el color de los enlacesactivos.<body background =“imagen.gif”>: Establece unaimagen para el fondo de lapágina.
  5. 5. ETIQUETAS DE HTMLFORMATO DE TEXTOS<b> </b> negrita: Tambiénsirve la etiqueta <strong></strong><i> </i> cursiva: Tambiénsirve la etiqueta <em></em><u> </u> subrayado<font size = “X”> </font>:Marca el tamaño de loscaracteres.<font color = “#XXYYZZ”></font>: Define el color deltexto.<font face = “arial”></font>: Determina el tipode la fuente.La etiqueta <font> puedeincluir los tres parámetros(tamaño, fuente y color).<pre> preformateado Respetaespacios, saltos de línea y losretornos utilizado.<blink> hace parpadear el texto(no para Explorer).
  6. 6. ETIQUETAS DE HTMLFORMATO DE PÁRRAFOS<p> salto depárrafo </p><br> salto delínea<blockquote></blockquote>sangrado<center>centrar eltexto<p align =center> párrafocentrado<p align = left>párrafo alineadoa la izquierda<p align = right>párrafo alineado ala derecha
  7. 7. ETIQUETAS DE HTMLCREACIÓN DE LISTAS• <ul>• <li> primer elemento de lalista </li>• <li> segundo elemento dela lista </li>• <li> tercer elemento de lalista </li>• </ul> cierra listaLISTA NONUMERADA• <ol>• <li> primer elemento de lalista </li>• <li> segundo elemento dela lista </li>• </ol> cierra listaLISTANUMERADA• <dl>• <dt> término que se va adefinir </dt>• <dd> definición deltérmino</dd>• </dl> cierra listaLISTA DEGLOSARIO ODEFINICIÓN
  8. 8. ETIQUETAS DE HTMLLÍNEAS HORIZONTALESSEPARADORAS<hr> líneahorizontal<hr width =“x%”> anchurade la línea enporcentaje<hr width = x>anchura de lalínea enporcentaje<hr size= x>alturade la líneade pixeles<hr align=center> líneaalineada en elcentro<hr align= left>línea alineada ala izquierda<hr align=right> líneaalineada a laderecha<hr noshade>línea sin efectode sombra
  9. 9. ETIQUETAS DE HTMLIMÁGENES• Indica la ruta de la imagen<img src = “dirección de la imagen” “>• Establece un borde de X pixeles en torno a la imagen.<img…border = “X”>• Establece un tamaño de la imagen (altura y anchura) en pixels.<img…height = “XX” width = “YY”>• Se muestra un texto al pasar el cursor sobre la imagen.<img…alt = “texto explicativo”>• Alineación inferior del texto respecto de la imagen.<img…align = “bottom”>• Alineación del texto en el medio de la imagen<img…align = “middle”>• Alineación superior del texto respecto de la imagen.<img…align = “top”>• Alineación izquierda de la imagen en el párrafo.<img…align = “left”>• Alineación derecha de la imagen en el párrafo.<img…align = “right”>• Espacio horizontal entre la imagen y el texto.<img…hspace = X>• Espacio vertical entre la imagen y el texto.<img…vspace = y>
  10. 10. ETIQUETAS DE HTMLTABLASÚtiles para componer la página y para presentar datos tabulares.Ejemplos:<table> … </table> Define dónde comienza y termina la tabla.<table width = “XX%”> O en porcentaje de la página.<table height = “XX”> Determina la altura de la tabla en pixeles.<table border = “X”> Establece el grosor en pixeles del borde de la tabla.<table cellspacing = “X”> Define el espacio en pixeles entre las celdas.<table cellpadding = “X”> Define el espacio en pixeles entre el borde y el texto.<tr>…<tr> Determina cada una de las filas de la tabla.<td>…</td> Determina cada una de las columnas dentro de las filas.<td rowspan = “2”> &nbsp; </td> une dos celdas de dos filas adyacentes, en una únicacelda.<td colspan= “2”> &nbsp; </td> une dos celdas de dos columnas adyacentes, en unasola celda.
  11. 11. ETIQUETAS DE HTMLCREACIÓN DE ENLACES• <a href =http://www.servidor.com/directorio/pagina.htm>Enunciado delenlace </a>• <a href =“mailito:dirección demail”> Vínculo auna dirección decorreo-e.•<a name =“marcador”> Define unmarcador (ancla) en unpunto concreto de unapágina, para poderenlazarloposteriormente• <a href =“#marcador”>dirige un enlaceinterno al puntodónde está elmarcador.• <a href =“direcciónpágina#marcador”> dirige el enlace aun punto concretode otra página.
  12. 12. ETIQUETAS DE HTMLPÁGINAS CON MARCOS (no llevabody)<html><head><title> título de la página </title></head>• Divide la página en dos marcos en forma de columnas,cada una con su anchura correspondiente enporcentaje.<framaset cols =“20%, 80%”>• Archivo menu.htm que corresponde al marco de laizquierda, llamado “navegación” , 20% de anchura.<frame src =“menu.htm” name =“navegación”>• Archivo principal.htm que corresponde al marco de laderecha, llamado “contenidos”, 80% de anchura<frame src =“principal.htm” name= “contenidos></frameset></html>
  13. 13. ETIQUETAS DE HTMLPÁGINAS CON MARCOS (no llevabody)Frameborder = “NO”evita que se vea elborde entre losmarcosFramespacing = “2”establece 2 pixels desepración entre losmarcos.Scrolling = “NO”evita que aparezcauna barra de scrolldentro del marcoScrolling = “auto”mostrará la barrade scroll sólo si esnecesarioLas páginas también se puedendividir en marcos horizontalescon <frameset rows = “ , ”>

×