Color en un texto en html

Imagen HTMLSi queremos poner un determinado color a un texto en HTML podemos añadir lo siguiente:

<span style=»color: blue;»>Color azul</span>, con lo que el texto visible nos quedaría así: Color azul

También podemos poner el color en hexadecimal, que está representado por un grupo de 6 dígitos, con 16 valores distintos que van del 0 al 9, y de la A a la F:

<span style=»color:#FF0000;»>Color rojo hexadecimal</span>, con lo que el texto visible nos quedaría así: Color rojo hexadecimal

Colores de los hipervinculos en HTML por defecto

Imagen HTMLAlgunas veces podemos necesitar saber cual es el color por defecto de los hipervínculos en HTML si, por ejemplo, estamos reutilizando una plantilla que tiene el color de los hipervínculos diferentes a los que vienen por defecto.

  • link: El color del link normal, es decir, uno que no ha sido visitado (que no se ha hecho click sobre él). Por defecto es el azul (creo que es «blue«).
  • vlink: Es el color de un link visitado (que se ha hecho click). Por defecto es el morado ( #800080).
  • alink: Indica el color de un enlace activo, quiere decir, cuando un enlace está presionado (este casi no se nota). Por defecto es el rojo ( #FF0000).

 

Formato línea o separador horizontal en HTML: hr

En HTML para crear una linea horizontal utilizamos

<hr />

Si queremos dar color a la línea horizontal lo hacemos así:

<hr style="color: #0056b2;" />

Si queremos variar el grosor de la línea, pondremos: «size=x», siendo «x» el número de grosor, por ejemplo:

<hr size="10" />

Si queremos variar lo que ocupa de ancho la línea horizontal usaremos: «width=x %», siendo «x» el tanto por cien que ocupa la línea:

<hr width="75%" />

Si queremos quitar la sombra a la línea horizonal

<hr noshade="noshade" />

Para alinear la linea a la izquierda, derecha o centro utilizamos «align». «align = center» para el centro, «align = right» para la derecha y «align = left» para la izquierda. Por ejemplo:

<hr align="left" noshade="noshade" size="2" width="80%" />

Hacer un hipervinculo al background de una div

Imagen HTMLPodemos hacer un hipervinculo sólo al background en un div, sin necesidad de poner otro tipo de contenido en el div.

Una posibilidad es hacerlo de la siguiente forma:

<div style="width:100px; height:20px; background: url(20x100image.gif);">
    <a href="URL" style="display:block;width:100px;height:20px;">&nbsp;</a>
</div>

 

Web códigos de colores hexadecimales

Si queremos buscar un colores en formato hexadecimal lo podemos hacer en la siguiente web:
http://html-color-codes.info/codigos-de-colores-hexadecimales/

Nos encontramos con 2 apartados:

1. Tabla de colores HTMLCon esta Tabla de colores HTML dinámica se pueden conseguir códigos HTML para los colores básicos. Podemos hacer clic en cualquier cuadro de color para conseguir su Código de color HTML
Tabla colores HTML
2. Selector de colores HTMLAquí podemos desplazar la barra de desplazamiento vertical para elegir el color y después hacemos clic en el cuadro de colores a la izquierda para conseguir el Código de color HTML para elegir el tono de color deseado.
Selector colores HTML

 

Atributos alt y title

Los atributos alt y title, són atributos que nos permiten indicar un texto descriptivo para un elemento HTML, según la especificación del W3C, su función sería:

  • alt – Indica un texto alternatívo a un elemento no textual
  • title – Indica un texto a mostrar en un tooltip cuando el mouse está sobre el objeto

Internet Explorer (IE)

alt este trabaja a su vez cómo title y nos muestra el tooltip

<!--  Tooltip con Internet Explorer -->
<img alt="Logo de la web" src="//www.programacionweb.net/imagen.gif">

 

Mozilla Firefox

El atributo alt se utiliza sólo como texto alternativo y para mostrar el tooltip hay que utilizar el atributo title ( compatible con IE y Firefox ).

<!--  Tooltip compatible con W3C -->
<img title="Logo de la web" alt="Texto alternativo" src="//www.programacionweb.net/imagen.gif">

 

En definitiva hay que utilizar los dos atributos: alt y title.