ProgramacióN Avanzada

280
-1

Published on

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
280
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

ProgramacióN Avanzada

  1. 1. PROGRAMACIÓN AVANZADA CURSO BÁSICO DE <HTML> MANEXO DE ETIQUETAS
  2. 2. A LINGUAXE HTML (Linguaxe Marcador de Hiper-Texto) <ul><li>“ Linguaxe de etiquetas ideado para crear documentos de hipertexto que se poden transferir dunha plataforma ou sistema a outra plataforma ou sistema”. </li></ul><ul><li>Deseñado para ser mostrado a través de navigadores ou visualizadores(browsers) de páxinas web en internet (Netscape,Explorer,…) </li></ul><ul><li>HTML céntrase no contido dos documentos, non na súa apariencia. </li></ul><ul><li>Permite incluir e representar: hipertexto, correo electrónico, documentación, hipermedia (vídeo, audio), menús de opcións, búsqueda en Bases de Datos, inserción de gráficos… </li></ul><ul><li>Información sobre estándares e novas normas en Internet, dispoñibles na URL “http://www.w3.org” </li></ul>
  3. 3. Vantaxes da utilización de HTML fronte a linguaxes sofisticados. <ul><li>Os documentos HTML son breves, polo que se poden transferir por Internet a maior velocidade. Non é necesario que inclúan información sobre o formato ou as fontes. </li></ul><ul><li>Os documentos HTML son independentes dos dispositivos, é dicir, despréganse en calquera plataforma; todo o que precisa é un visualizador para a plataforma na que traballe, que sexa capaz de entender HTML. </li></ul><ul><li>A nivel de programación, é un linguaxe moi sinxelo para aprender e de breve e fáci manexo. Son moi poucas as etiquetas e instruccións que se teñen que recordar e ademais hai no mercado editores que facilitan o seu manexo. </li></ul>
  4. 4. Estructura básica dun documento HTML Documento HTML <HTML> </HTML> Cabecera del documento Cuerpo del documento <HEAD> · · </HEAD> <BODY> · · · </BODY>
  5. 5. Cabeceira do documento <ul><li><HEAD> </li></ul><ul><li><!- Isto é un comentario e non inflúe para nada no documento HTML-> </li></ul><ul><li><TITLE>A miña primeira páxina en HTML</TITLE> </li></ul><ul><li><META HTTP_EQUIV=“Author” CONTENT = “Carmen”> </li></ul><ul><li> <META HTTP_EQUIV=“refresh” CONTENT=“5;URL=http://www. > </li></ul><ul><li><BASE href=http://www.a miña web.es/imágenes/> </li></ul><ul><li><ISINDEX> </li></ul><ul><li><LINK> </li></ul><ul><li><NEXTID> </li></ul><ul><li></HEAD> </li></ul>
  6. 6. Corpo do documento 1/7 <ul><li><HTML> </li></ul><ul><li><!-Comeza a cabeceira da páxina->(comentario que non aparece na páxina) </li></ul><ul><li><!-***************************************-> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> A miña primeira páxina en HTML</TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><!-*********************************************************-> </li></ul><ul><li><!- Comeza o corpo da páxina-> </li></ul><ul><li>Trazar unha liña horizontal: </li></ul><ul><li><HR> </li></ul><ul><li>Insertar unha imaxe de fondo: </li></ul><ul><li><BODY BACKGROUND=“imaxes/ fondo.gif”> </li></ul><ul><li>Poñer unha cor de fondo: </li></ul><ul><li><BODY BGCOLOR=“#rrggbb”> </li></ul>
  7. 7. Corpo do documento 2/7 <ul><li>Tamaño da letra </li></ul><ul><li>Exemplos do comando “FONT SIZE” </li></ul><ul><li><FONT SIZE=7> </FONTSIZE> </li></ul><ul><li><FONT SIZE=6> </FONTSIZE> </li></ul><ul><li>· </li></ul><ul><li>· </li></ul><ul><li><FONT SIZE =1> </FONTSIZE> </li></ul><ul><li>Tipos de letra que se poden utilizar : </li></ul><ul><li><b> negrita </b> </li></ul><ul><li><i> italica </i> </li></ul><ul><li><u> suliñado </u> </li></ul><ul><li><strong> fuerte </strong> </li></ul><ul><li><blink> intermitente </blink> </li></ul><ul><li><em> resaltado </em> </li></ul><ul><li><sub> </sub> subindice <sup> </sup> superíndice </li></ul><ul><li><FONT FACE =“ arial”> </li></ul>
  8. 8. Corpo do documento 3/7 <ul><li>Encabezados: </li></ul><ul><li>Permite 6 niveis, úsase Hnº, ademais a alineación pode facerse diferente en cada nivel usando ALING = “left” “center” “right” </li></ul><ul><li><H1 aling=“left”> Título 1 </H1> </li></ul><ul><li><H2 aling=“center”> Título 2 </H2> </li></ul><ul><li>· </li></ul><ul><li>· </li></ul><ul><li>· </li></ul><ul><li>Párrafos: </li></ul><ul><li>Pode escribirse de forma normal, </li></ul><ul><li><p> permite comezar outro párrafo </li></ul><ul><li><br> o mesmo pero con menor separación, </li></ul><ul><li>Non e necesario rematar con </p>, xa se entende que o comezar un párrafo acabou o anterior. </li></ul>
  9. 9. Corpo do documento 4/7 <ul><li>Para facer listas: </li></ul><ul><li><ul> usaría viñetas do tipo · </li></ul><ul><li><li> Ana </li></ul><ul><li><li> Marta </li></ul><ul><li></ul> </li></ul><ul><li><ol> usaría números </li></ul><ul><li><li> Ana </li></ul><ul><li><li> Marta </li></ul><ul><li></ol> </li></ul><ul><li>Lista libre: </li></ul><ul><li><dl> </li></ul><ul><li><dt> Can </li></ul><ul><li><dd> ladra </li></ul><ul><li><dt> Gato </li></ul><ul><li><dd> miaña </li></ul><ul><li></dl> </li></ul>
  10. 10. Corpo do documento 5/7 <ul><li>Táboas: </li></ul><ul><li><table> ou se se quere con borde <table border = nº> </li></ul><ul><li><TR> filas <TD> datos da celda </li></ul><ul><li><TH> encabezado da táboa </li></ul><ul><li>Exemplo: </li></ul><ul><li><TABLE BORDER = 2> </li></ul><ul><li><TR> </li></ul><ul><li><TH> Co1 <TH> Co2 <TH> Co3 </li></ul><ul><li></TR> </li></ul><ul><li><TR> </li></ul><ul><li><TD> 12 </TD> <TD> 34</TD> <TD> 54 </TD> </li></ul><ul><li></TR> </li></ul><ul><li></TABLE> </li></ul><ul><li>Para agrupar celdas: </li></ul><ul><li><TD COLSPAN =nº> </li></ul><ul><li><TD ROWSPAN =nº> </li></ul>54 34 12 Co3 Co2 Co1
  11. 11. Corpo do documento 6/7 <ul><li>Imaxes: </li></ul><ul><li>Para insertar imaxes na páxina </li></ul><ul><li><img src =“foto.gif” </li></ul><ul><li><img src =“http:// ………” > </li></ul><ul><li>Ademais a imaxe pode aliñarse con texto usando: </li></ul><ul><li>ALING = bottom </li></ul><ul><li>middle </li></ul><ul><li>top </li></ul><ul><li>left </li></ul><ul><li>right </li></ul><ul><li>BORDER = n liña de borde de ancho n </li></ul>
  12. 12. <ul><li>Hipertexto: </li></ul><ul><li>Se queremos que un texto nos vincule a algunha páxina usamos o seguinte: </li></ul><ul><li><a href=http://www.xunta.es> Pulse para visitar a páxina da xunta</a> </li></ul><ul><li>Unha imaxe tamén se pode usar como ancla e hipertexto </li></ul><ul><li><a href=“xxxx.html”> </li></ul><ul><li><IMG SRC =“……..gif”> </a> </li></ul>Corpo do documento 7/7
  13. 13. No bloc de notas: <ul><li><HTML> </li></ul><ul><li><HEAD> </li></ul><ul><li><TITLE> A miña páxina HTML </TITLE> </li></ul><ul><li></HEAD> </li></ul><ul><li><BODY BACKGROUND=&quot;D:FOTOSFotos 2009Manzaneda1.jpg&quot;> </li></ul><ul><li><font size=8> </li></ul><ul><li><b> Estou esribindo a primeira liña da miña páxina web </b> </li></ul><ul><li></font size=8> </li></ul><ul><li></BODY> </li></ul><ul><li></HTML> </li></ul>

×