Atom
Increíble editor web, uno de mis favoritos.
Gratis, multiplataforma, de código abierto, ligero y personalizable. No se le puede pedir más.
Estilos para enlaces - Curso de CSS3 básico - Capítulo 10
En esta ocasión te voy a enseñar a decorar el texto de los enlaces con CSS. No obstante, todo lo que vas a aprender en este capítulo, lo podrás aplicar a cualquier elemento de tipo texto como los párrafos, cabeceras, etc.
Un enlace por defecto
Por defecto, un enlace nos suele aparecer de esta forma en el navegador:
Aplicando estilo a todos los enlaces
Voy a aplicar el estilo a todas las etiquetas <a>, de este modo, afectará a todos los enlaces.
text-decoration none
Utilizando el valor none en text-decoration vamos a obtener enlaces que seguirán con su color azul, pero perderán el subrayado.
CSS
a {
text-decoration: none;
}
Tipos de líneas para enlaces
En los enlaces, podemos especificar si queremos que la raya del subrayado aparezca en medio (tachado) o incluso arriba del enlace.
Enlace tachado
Con el valor line-through conseguimos el efecto de enlace tachado. Esto se utiliza normalmente para desahbilitar un enlace borrado, pero que quede constancia al usuario, que anteriormente había ahí un enlace. Se hace también muchos con texto como el de los párrafos.
CSS
a {
text-decoration: line-through;
color: red;
font-size:100px;
}
Enlaces con línea superior
Con el siguiente valor, podemos hacer que la línea aparezca por encima del texto del enlace.
CSS
a {
text-decoration: overline;
color: red;
font-size:100px;
}
Finalmente, te debo indicar que si utilizas text-decoration: underline; creas el efecto de subrayado que tienen los enlaces por defecto.
Capítulos
Suscríbete a mi canal de YouTube para apoyarme
Si te ha gustado este curso y crees que el trabajo merece la pena, te agradeceré eternamente que te suscribas a mi canal de YouTube para apoyarme y que pueda seguir haciendo cursos gratuitos.
Además, si te encanta la programación, tienes un montón más de cursos gratuitos para ver.
No solo eso, podrás participar enviándome comentarios con tus sugerencias para temas específicos o cursos completos o incluso las dudas que tengas y las intentaré ir resolviendo en los cursos que estén todavía abiertos.
