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.
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.
Por defecto, un enlace nos suele aparecer de esta forma en el navegador:
Voy a aplicar el estilo a todas las etiquetas <a>
, de este modo, afectará a todos los enlaces.
Utilizando el valor none
en text-decoration
vamos a obtener enlaces que seguirán con su color azul, pero perderán el subrayado.
a {
text-decoration: none;
}
En los enlaces, podemos especificar si queremos que la raya del subrayado aparezca en medio (tachado) o incluso arriba del enlace.
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.
a {
text-decoration: line-through;
color: red;
font-size:100px;
}
Con el siguiente valor, podemos hacer que la línea aparezca por encima del texto del enlace.
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.
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.