HTML

Colegio BuceriasHtml

Celina ValenzuelaIng. Azucena Cervantes

07/05/151’’B’’

¿Qué es una fuente en código HTML? La etiqueta <font> está desaprobada.

Esta etiqueta especifica el tamaño, color y tipo de fuente para un texto.

 ¿Cuáles son las etiquetas para manipular el tamaño de la letra?

Define el tamaño de la letra. Este tamaño puede ser absoluto o relativo.Si hablamos en términos absolutos, existen 7 niveles de tamaño distintos numerados de 1 a 7 por orden creciente. Elegiremos por tanto un valor size="1" para la letra más pequeña o size="7" para la más grande. <font size=4>Este texto es más grande</font>Que se visualizaría así en una página web.

Este texto es más grande

Etiquetas para generar encabezados

Puede que queramos empezar nuestra web o nuestro texto con un encabezado indicando el título del artículo, categoría, etc. Pues bien, para escribir encabezados disponemos de las etiquetas <h>.

Esta etiqueta viene acompañada de un número, desde el 1 hasta el 6, predefiniendo éstos el tamaño del encabezado. Así, <h1> sería el encabezado más grande mientras que <h6> sería el más pequeño.

A continuación mostramos un código ejemplo de los seis diferentes encabezados:

 ¿Qué es la etiqueta font face? Define el tipo de letra. Hay que tener cuidado con este atributo ya que cada

usuario, dependiendo de la plataforma que utilice, puede no disponer de los mismos tipos de letra que nosotros con lo que, si nosotros elegimos un tipo del que no dispone, el navegador se verá forzado a mostrar el texto con la fuente que utiliza por defecto (suele ser Times New Roman). Para evitar esto, dentro del atributo suelen seleccionarse varios tipos de letra separados por comas.

<font face="Comic Sans MS,arial,verdana">Este texto tiene otra tipografía</font>

¿Cómo se puede manipular el color de la fuente? El color del texto puede ser definido

mediante el atributo color. Cada color es a su vez definido por un número hexadecimal que esta compuesto a su vez de tres partes. Cada una de estas partes representa la contribución del rojo, verde y azul al color en cuestión.

<font color="red">Este texto está en rojo</font>

Etiquetas HTML HTML define 91 etiquetas que los diseñadores

pueden utilizar para marcar los diferentes elementos que componen una página:

a, abbr, acronym, address, applet, area, b, base, basefont, bdo, big, blockquote, body, br, button,caption, center, cite, code, col, colgroup, dd, del, dfn, dir, div, dl, dt, em, fieldset, font, form, frame,frameset, h1, h2, h3, h4, h5, h6, head, hr, html, i, iframe, img, input, ins, isindex, kbd, label, legend, li,link, map, menu, meta, noframes, noscript, object, ol, optgroup, option, p, param, pre, q, s, samp, script,select, small, span, strike, strong, style, sub, sup, table, tbody, td, textarea, tfoot, th, thead, title,tr, tt, u, ul, var.

Ejemplo: <ETIQUETA>Elementos Afectados por la Etiqueta</ETIQUETA>Por ejemplo, con la etiqueta siguiente:<B>Texto que será en negrita</B>.Obtendremos:Texto que será en negrita

Marquee La etiqueta <MARQUEE> </MARQUEE> crea una

marquesina cuyo contenido se desplaza. Por defecto, ocupa todo el ancho de la pantalla, tiene una línea de altura y el texto se mueve lentamente de derecha a izquierda.

Los atributos WIDHT y HEIGHT permiten controlar el ancho y el alto de la marquesina y pueden expresarse en pixeles o porcentualmente. El atributo ALIGN permite alinear el texto que rodea la marquesina, y puede tener los siguientes valores: top (arriba), middle (centrado) bottom (abajo). Los atributos HSPACE y VSPACE definen la separación horizontal y vertical del texto con los bordes de la marquesina:

<marquee width="50%" height="60" align="bottom">... texto ...</marquee>

<IMG> La etiqueta <IMG> Nos sirve para insertar una

imagen en nuestra pagina web La marca <IMG> no necesita cierre y su sintaxis

correcta es:

<IMG SRC="immagine.gif">

Donde SRC corresponde al inglés Search y es el recorrido del que el navegador saca la imagen (en este caso "immagine.gif"). Como hemos señalado, esta marca es única en el sentido de que NO lleva como cierre el correspondiente </IMG>.

WIDTH y HEIGHT  Es posible definir la anchura y la altura de la imagen

gracias a los atributos width y height, respectivamente:

<IMG SRC="immagine.gif" WIDTH=178 HEIGHT=180 ALT="Obra de K. Haring">

donde WIDTH=178 es la dimensión horizontal (ancho) de la imagen expresada en píxel, y HEIGHT=180 la dimensión vertical (alto).

Mediante estos atributos podemos definir dimensiones diferentes de las que realmente tiene la imagen. En cualquier caso, es aconsejable insertar imágenes con su tamaño efectivo sobre todo si están en formato GIF, dado que, cuando se cambian las medidas, este formato pierde mucha calidad.

ALT El uso de texto para comentar las imágenes es una regla

fundamental que debemos observar en la creación de sitios web por varias razones:

algunos navegadores pordrían estar impostados para no invocar las imágenes;los navegadores textuales para invidentes no conseguirían interpretar las imágenes si carecieran de comentario;es posible evitar pies de imagen incluyendo comentarios dentro de la imagen misma.

En todos estos casos, el uso de comentarios resuelve el problema y permite optimizar la página web. La sintaxis correcta de los comentarios es la siguiente:

<IMG SRC="immagine.gif" ALT="Obra de K. Haring">

APAVirtualnauta ( ) FontRecuperado el 7 de mayo de 2015De: http://www.virtualnauta.com/html-etiqueta-fontDesarrollo Web (2001) Font size/Font face/ColorRecuperado el 7 de mayo de 2015De: http://www.desarrolloweb.com/articulos/556.phpAprender a Programar ( ) EncabezadoRecuperado el 7 de mayo de 2015De:http://aprenderaprogramar.com/index.php?option=com_content&view=article&id=489:encabezados-html-h1-a-h6-parrafos-aplicar-estilos-y-etiqueta-pre-texto-preformateado-ejemplo-cu00715b&catid=69:tutorial-basico-programador-web-html-desde-cero&Itemid=192Libros Web ( ) EtiquetasRecuperado el 7 de mayo de 2015De:http://librosweb.es/libro/xhtml/capitulo_2/etiquetas_y_atributos.html

Vagabundia (2007) MarqueeRecuperado el 7 de mayo de 2015De:http://vagabundia.blogspot.com/2007/03/desplazamientos-de-textos-marquee.htmlHTML POINT ( ) IMG/Ancho-Alto/AltRecuperado el 7 de mayo de 2015De: http://www.htmlpoint.com/guida/html_09.htm