<Código-Web>
Elementos HTML
y Reglas CSS

  1. TEXTOS
  2. ENLACES
  3. LISTAS
  4. IMÁGENES
  5. TABLAS
  6. FORMULARIOS
  7. MAQUETACIÓN

TEXTOS > Énfasis

 

Para resaltar texto en una página Web normalmente utilizamos letra en negrita (etiqueta <strong>), letra en cursiva (etiqueta <em>) y otras veces, habitualmente en páginas de comercio electrónico, texto tachado (etiqueta <del>).

Es decir, si en el archivo HTML marcamos un texto así:

*

Obtenemos esto en el navegador:

*

La etiqueta <u>, que provoca que el texto aparezca subrayado ha quedado obsoleta y además se aconseja no subrayar palabras porque puede confundir al usuario pensando que es un enlace.

Otras marcas "especiales"


acronym

El elemento HTML <acronym> define a su contenido como un acrónimo (Tipo de sigla que se pronuncia como una palabra) y se utilizada junto con el atributo "title" para explicar el acrónimo. Los navegadores habitualmente muestran el contenido del atributo "title" en un recuadro al dejar el ratón unos segundos encima del contenido del elemento. Pero en este caso (a diferencia de otros elementos) no debes olvidar que el contenido del atributo "title" explica el acrónimo (por ejemplo: UNESCO, ONU, FMI,...)

abbr

El elemento HTML <abbr> contiene texto abreviado y es comúnmente utilizado junto con el atributo "title" para explicar la abreviatura. Los navegadores habitualmente muestran el contenido del atributo "title" en un recuadro al dejar el ratón unos segundos encima del contenido del elemento. Pero en este caso no debes olvidar que el contenido del atributo "title" explica la abreviatura (por ejemplo: Sr., Dr., Dpto.,...)

dfn

El elemento HTML <dfn> contiene un término que es descrito por el párrafo que lo contiene. Es útil para marcar a un término con su propia descripción.

Los navegadores pueden mostrar el texto dentro de este elemento de manera diferente, usualmente en fuente itálica.

Por ejemplo: El nombre hojas de estilo en cascada viene del inglés Cascading Style Sheets, del que toma sus siglas. CSS es un lenguaje usado para definir la presentación de un documento estructurado escrito en HTML

 

Tipo de letra


La fuente (tipografía o tipo de letra) también juega un papel fundamental en el diseño de nuestro sitio Web y en el "énfasis" de ciertas partes del texto. De ella depende que un potencial lector siga leyendo o abandone la página porque le resulte demasido incómoda para poder leerla.

La mayoría de las fuentes tienen varios estilos dentro de una misma familia: suele haber un estilo en negrita y otro en cursiva; a menudo también uno en negrita y cursiva; menos frecuentemente, un estilo de versales y, en unos pocos casos, versiones extrafinas/extragruesas o estiradas/comprimidas.

Ver más detalles en el epígrafe [Tipografía] de este sitio.

 

Otros adornos


Para el resto de "adornos" que nos interese hacer al texto es conveniente crear una "regla CSS" utilizando un selector de CLASE (el que comienza por un punto . en el archivo de estilos) y utilizaremos al etiqueta <span>, o cualquier otra etiqueta HTML, con el atributo CLASS para marcar el texto en el archivo HTML.

Por ejemplo:

Si queremos marcar una línea como si hubiéramos pasado un rotulador amarillo creamos la siguiente regla CSS

.rotulador_ama { background: #ffff00}

Y si queremos que los elementos de encabezado <h1> a <h6> tengan distintos colores colocaremos estas reglas en el archivo CSS

h1{ color: #ff0000; }
h2{ color: #00ff00; }
h3{ color: #0000ff; }
h4{ color: #ffff00; }
h5{ color: #ff00ff; }
h6{ color: #00ffff; } 

De manera que el archivo HTML quedará de esta manera:

*

Y en el navegador veremos esto:

*

La línea <link rel="stylesheet" type="text/css" media="screen" href="estilos.css" /> dentro de la cabecera de la página sirve para enlazar el archivo CSS, llamado estilos.css, con el archivo HTML.

Ver más detalles en el epígrafe [Con estilos] de este sitio.

 


- (cc) 2012, 3con14 -