Bienvenido a VidaBlogger, un sitio dedicado a brindar Ayuda para Blogs.

Vas a poder encontrar trucos blogger, tutoriales y herramientas para blogs, aprenderás estrategias sobre SEO y posicionamiento web, y te daremos los mejores consejos para que lleves tu blog al máximo potencial!





7 ago. 2009

CSS Básico: Modificar el color de los links

Hoy vamos a comenzar con una pequeña guía de CSS. Antes de meternos de lleno en la guía CSS veamos algunas preguntas interesantes para comprender mejor de que estamos hablando.

¿Qué es CSS?
Hojas de Estilo en Cascada (Cascading Style Sheets), es un mecanismo simple que describe cómo se va a mostrar un documento en la pantalla, o cómo se va a imprimir, o incluso cómo va a ser pronunciada la información presente en ese documento a través de un dispositivo de lectura. Esta forma de descripción de estilos ofrece a los desarrolladores el control total sobre estilo y formato de sus documentos.

¿Para qué sirve?
CSS se utiliza para dar estilo a documentos HTML y XML, separando el contenido de la presentación. Los Estilos definen la forma de mostrar los elementos HTML y XML. CSS permite a los desarrolladores Web controlar el estilo y el formato de múltiples páginas Web al mismo tiempo. Cualquier cambio en el estilo marcado para un elemento en la CSS afectará a todas las páginas vinculadas a esa CSS en las que aparezca ese elemento.
En resumen podemos decir que el CSS es quien define como se mostrará tal o cual elemento en la página.

La guía CSS de hoy va destinada a aprender a modificar y destacar los enlaces del blog. Sabemos que cuando ponemos un link hacia cualquier sitio, la palabra que contiene el link está de otro color, mostrando al lector que allí tienen un enlace que puede seguir.

Pero hay veces que deseamos modificar el color del link para que llamen la atención, o bien lo queremos cambiar para no hacerlos tan destacables y molestos. En fin, para cualquier situación en la que deseamos cambiar los enlaces solo debemos modificar algunos parámetros de CSS de nuestra plantilla.

Aquí les dejo la lista de cambios que deberían hacer para modificar cualquier parte de los links de su blog. Como ven, entre asteriscos está la explicación de para que es tal cosa. Si deseamos cambiar el color solo debemos modificar el código del color. Puedes ver esta página que muestra los colores hexadecimales: Generador de colores.
a:link { /* Enlaces sin visitar */
color:#990000; /* Color especial y... */
text-decoration:none; /* ...sin subrayado */
}
a:visited { /* Enlaces ya visitados */
color:#cccccc; /* Otro color... */
text-decoration:none; /* ...y también sin subrayado */
}
a:hover { /* Efecto al pasar el puntero por encima del enlace */
color:#880000; /* Otro color distinto... */
text-decoration:underline; /* ...y texto subrayado en esta ocasión*/
}
a img { /* Enlaces en imágenes */
border-width:0; /* Sin borde */
}
Para hacer estas modificaciones debemos ir a la edición HTML de la plantilla y buscar la sección de links en el CSS.

Les recomiendo que cuando cambien algún color den vista previa para ver si el cambio efectuado surge el efecto deseado, y una vez que realizamos todos los cambios guardamos la plantilla y ya tenemos los enlaces del blog destacados a nuestro gusto.

Si te ha gustado este post, no dudes en suscribirte al feed RSS de VidaBlogger - Ayuda para Blogs!

2 comentarios :

  1. Muxas gracias.. me ha sido de gran ayudaaa.. al fin pude cambiar la apariencia de los links, puesto q no me gustaba nada como los mostraba la plantilla..

    http://sgroyaparadise.blogspot.com/

    ResponderEliminar
  2. Buenas tardes, tengo un problema quiero modificar el color de mis enlaces por defecto, pero el problema es que no encuentro la línea en mi HTML. Alguien que pueda ayudarme? no se, tal vez haya una variante, que mis enlaces no se muestran en otro color, se ven al mismo color del texto, y la verdad es dificil reconoces los enlaces de mis entradas...

    Saludos!

    ResponderEliminar

Lea las reglas:

Todos los comentarios serán leídos y moderados previamente.

Serán publicados aquellos comentarios que respeten las siguientes reglas:
- Su comentario debe estar relacionado al contenido del post.
- No se aceptan comentarios tipo SPAM.
- No incluya links No necesarios en el contenido de su comentario.
- Si quieres dejar la url de tu blog, hazlo utilizando la opción OpenID.
- La caja de comentarios no es el lugar para pedir intercambio de links (para ello ve a la página de contacto).
- Ofensan personales, amenazas o insultos NO serán permitidos.

OBS: Los comentarios de los lectores no reflejan las opiniones del blog.