Cómo resaltar texto en CSS

Escrito por finn mccuhil | Traducido por lucia ayala
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo resaltar texto en CSS
Resalta texto en tu página web con CSS. (Hemera Technologies/PhotoObjects.net/Getty Images)

Agregar CSS en el código HTML hace de resaltar y ajustar otras propiedades de texto un proceso simple. Los diseñadores web utilizan CSS para lograr una variedad de efectos de texto en sus sitios. En muchos casos, se puede ver el código en línea utilizado para conseguir un efecto determinado mediante el uso de "Ver código fuente". Una vez que te familiarices con la codificación de estilos y de sintaxis en CSS, puedes duplicar los métodos de los demás y crear efectos de texto llamativos por tu cuenta.

Nivel de dificultad:
Moderadamente fácil

Otras personas están leyendo

Instrucciones

  1. 1

    Resalta una sección de texto con color. Introduce una etiqueta <span> al principio del texto que deseas resaltar y especifica un color de fondo al ejemplo siguiente:

    <span style='background-color:red"> El fondo de este texto es de color rojo </ span>

  2. 2

    Usa una imagen para el fondo del texto. Crea un archivo de imagen de la forma y tamaño deseados en tu editor gráfico favorito, luego vincúlalo a una etiqueta <div> en tu página de la siguiente manera:

    <div style="background-image:url('myCoolPicture.gif')"> Este texto aparece en mi imagen genial. </ div>

  3. 3

    Crea un borde. Utiliza la propiedad de esquema con una etiqueta <span> para dibujar un cuadro alrededor de una sección de texto para añadir énfasis con el código:

    <span style="outline:1px solid red"> Estas palabras están en una caja. </ span>

    Esto dibuja un borde rojo de un píxel en torno a las palabras entre la apertura y cierre de etiquetas <span>.

Consejos y advertencias

  • CSS tiene un gran número de efectos de texto diseñados para hacer que el texto se destaque. Obtén el máximo provecho de estos efectos usándolos con moderación. A pesar de que la página solo contiene la información más importante que debe ser leída por todos de inmediato, muchos pasajes subrayados en tu página serán difíciles de leer.

No dejes de ver

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles