Translate

Formatos de texto html

thumb

Vamos a ver una serie de etiquetas y atributos básicos para la creación de páginas webs. No entraremos a describir una a una todas las etiquetas y atributos de que HTML dispone. Simplemente indicaremos las que han sido más utilizadas en el pasado, aunque algunas se consideren deprecated (no recomendadas)..

FORMATOS DE TEXTO EN HTML: NEGRITA, CURSIVA, TACHADO, SUBRAYADO, SUPERÍNDICE, SUBÍNDICE.

Vamos a ver una serie de etiquetas y atributos básicos para la creación de páginas webs. No entraremos a describir una a una todas las etiquetas y atributos de que HTML dispone. Simplemente indicaremos las que han sido más utilizadas en el pasado, aunque algunas se consideren deprecated (no recomendadas).

Las primeras etiquetas que veremos son las que se usaban en el pasado para dar formato al texto. Para ello tenemos una serie de etiquetas que escribimos en HTML envolviendo la palabra o el texto y que transforman ese texto en el formato que nosotros le hayamos querido dar. Algunas de estas etiquetas están no recomendadas (deprecated) por lo que no debemos emplearlas. Otras etiquetas han adquirido un nuevo significado en las últimas versiones de HTML, pero no vamos a entrar a definir este nuevo significado. Debido a su amplia difusión en el pasado conviene conocer los que fueron usos tradicionales de estas etiquetas, a medida que avances en el conocimiento de HTML podrás comprobar cómo para algunas etiquetas se consideran hoy día nuevos significados.

ETIQUETA

USO

OBSERVACIONES

<b>…</b>

Poner texto en negrita

Puede ser sustituido por CSS.

<strong>…</strong>

Poner texto en negrita

Puede ser sustituido por CSS.

<i>…</i>

Poner texto en cursiva

Puede ser sustituido por CSS.

<em>…</em>

Poner texto en cursiva

Puede ser sustituido por CSS.

<u>…</u>

Poner texto subrayado

Deprecated. Sustituir por CSS.

<small>…</small>

Poner texto más pequeño

Puede ser sustituido por CSS.

<big>…</big>

Poner texto más grande

Puede ser sustituido por CSS.

<sub>…</sub>

Poner texto subíndice

Puede ser sustituido por CSS.

<sup>…</sup>

Poner texto superíndice

Puede ser sustituido por CSS.

<strike>…</strike>

Poner texto como tachado

Deprecated. Sustituir por CSS.

<s>…</s>

Poner texto como tachado

Deprecated. Sustituir por CSS.

<del>…</del>

Poner texto como tachado

Puede ser sustituido por CSS.

Como verás, algunas de las etiquetas que vamos a explicar están obsoletas (deprecated en inglés). Estas etiquetas en principio no deben de ser usadas porque dejarán de existir en las nuevas versiones a partir de HTML 5 y los navegadores es posible que dejen de reconocerlas en un futuro. Los motivos para incluirlas en este curso son:

- Son etiquetas que han sido muy populares en el pasado y te puedes encontrar muchas páginas webs que hacen uso de ellas.

- Son etiquetas reconocidas por prácticamente todos los navegadores actuales.

- Son una buena forma de introducirnos en los lenguajes propios de desarrollos webs desde el punto de vista didáctico. Una vez se entiendan estos conceptos, es más fácil abordar aspectos más avanzados como las hojas de estilo CSS.

Las etiquetas deben rodear al texto. Es decir, la etiqueta debe abrirse y cerrarse, conteniendo el texto o la palabra que queramos transformar en su interior. Por ejemplo:

<b>Este texto aparecerá escrito en negrita</b>.  Se pueden combinar diferentes formatos, o sea, diferentes etiquetas. Por ejemplo, si queremos que un texto esté en negrita y en cursiva escribiríamos esto: <b><i>Este texto aparecerá escrito en negrita y en cursiva</i></b>.

Cuando combines, ten cuidado a la hora de cerrar las etiquetas. Debes cerrar las etiquetas por orden, de la más interior a la más exterior.

Veamos las etiquetas que hemos citado en la tabla anterior.

NEGRITA

Existen dos etiquetas que hacen que nuestro texto se convierta en negrita. La utilización de cualquiera de ellas es en principio indiferente (aunque pueda atribuírseles un significado diferente a cada una de ellas no vamos a prestarle atención a esto ahora). La primera es la etiqueta <b> y la otra es la etiqueta <strong>. Aquí va un ejemplo de código y lo que veríamos en pantalla:

Esta palabra la vamos a poner en <b>negrita</b> y esta otra <strong>también</strong>

Esta palabra la vamos a poner en negrita y esta otra también

Normalmente se preferirá usar técnicas CSS en lugar de esta etiqueta, pero es una etiqueta que debemos conocer.

Continue reading...

1 2

0 comentarios:

Publicar un comentario