HTML: etiquetas más usadas

En la primera evaluación de informática aprendimos a programas con html. Lo primero que estudiamos fue la estructura de las páginas html. Las páginas html funcionan a base de etiquetas que se abren <XXXX>y una vez se ha terminado de especificar todos los valores y variables que hay, se cierran </XXXX>
Las páginas son abiertas por la etiqueta <html> a continuación se usa la etiqueta <head>, el encabezamiento  que sirve para definir algunos valores válidos para todo el documento. Al cerrarla se continua con la etiqueta <body>, el cuerpo, donde reside la información del documento. Las etiquetas más específicas son:


  •  Las de formato: <title> para títulos y <h1>, <h2> <h3> etc. para establecer los distintos tamaños de la fuente.
  • <p> para separar los párrafos.
  • Para alinear el texto están los atributos <center>, <right> y <left>
  • <hr> para crear una linea horizontal que atraviesa toda la página
  • Para establecer los fondos de la páginas se utiliza <body background="nombre_de_archivo">  que no es una etiqueta en si no que es un atributo para poner una imagen como fondo de la página o …..bgcolor="#rrggbb para establecer un color como fondo
  • Otro atributo es el del color y tamaño del texto ...text="#rrggbb" "00px"
  • Para hacer una lista numerada, se utiliza la etiqueta <ol> y en cada parte de la lista la etiqueta <li>.
  • Para hacer una lista no numerada, es igual pero la etiqueta es <ul>
  • para hacer una tabla Se comenzará declarando la etiqueta <table>, dentro de ellas unas filas <tr>, y dentro de cada fila, tantas columnas <td> como se quiera
  • Dentro de las tablas hay varios atributos tales como: 
    • border=numero 
    • align=top¦bottom
    • align=left¦center¦right 
    • colspan=numero  (que indica cuantas columnas ocupa la celda)
    • rowspan=numero (indica cuántas líneas ocupa la celda)
    • width=numero¦porcentaje (establece el ancho de la tabla o de las celdas especificadas en un valor en píxeles o en porcentaje con respecto al ancho del documento)
  • Para insertar imágenes se utiliza <img src="imagen.jpg" width=000 height=000 BORDER=0 ALT="otro título;" align="xxxx">
  • La etiqueta frame nos permite dividir la pantalla de la web en varios espacios distintos. Incluso es posible incluir en cada marco una página web distinta. Funciona así 

  <FRAMESET ROWS=75,*>  
               <FRAME SRC="frames1.htm" >
                <FRAME SRC="frames2.htm" >  
         </FRAMESET>   
    •  rows (filas) es el que define el número y el tamaño de los frames, en este caso dos filas, de 75 píxels la primera y el resto de la ventana la segunda. También se puede dividir en columnas mediante cols.
  • Podemos insertar una capa o contenedor a través de las etiquetas <div> y </div>
    •  A través del atributo STYLE se establecen las propiedades de estilo de la capa mediante el lenguaje CSS.
      • <html>
      •  <head>
      •  <title>Ejemplo</title>
      •  </head>
      •  <body>
      •  <div style="border: 1px solid red;"> asdf </div>
      •  <div style="border: 1px solid green;"> ghjk </div>
      •  <div style="border: 1px solid blue;"> lñzx </div>
      •  </body>
      •  </html> 
  • Los atributos CSS más útiles son: 

Con la tecnología de Blogger.