Cómo cambiar el color de texto en JavaScript

Escrito por lysis | Traducido por elizabeth garay ruiz
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo cambiar el color de texto en JavaScript
El cambiar el color del texto impacta en el diseño de las páginas web. (Hemera Technologies/PhotoObjects.net/Getty Images)

El cambiar el color del texto en una página web da a los usuarios una experiencia interactiva inesperada y es uno de los modos más efectivos para impactar el diseño de las páginas web. Un usuario puede cambiar los colores del texto usando JavaScript y ajustes de estilo empleando una de las muchas técnicas en el código HTML.

Nivel de dificultad:
Moderado

Otras personas están leyendo

Instrucciones

  1. 1

    Crea elementos HTML que contengan texto. Este ejemplo muestra cómo crear tres etiquetas que pueden usar funciones JavaScript creadas en los siguientes pasos: <div id="myDiv"> Change the color of the Div (cambia el color del Div) <p id="myParagraph"> Change this paragraph text color. (Cambia el color de texto de este párrafo). <span id="mySpan">Change the span tag color </span> </p> </div>

  2. 2

    Crea la función para la etiqueta div. La siguiente función JavaScript toma la etiqueta div creada en el paso 1 y cambia el color a rojo: function divColorChange() {document.getElementById('myDiv').style.color = '#FF0000';}

  3. 3

    Cambia el color de la etiqueta del párrafo. La siguiente función JavaScript cambia el color del texto del elemento del párrafo creada en el paso 1 a blanco: function paraColorChange() {document.getElementById('myParagraph').style.color = '#000000';}

  4. 4

    Cambia el color de la etiqueta de expansión. Finalmente cambia la etiqueta de texto a negro con el siguiente código: {document.getElementById('mySpan').style.color = '#FFFFFF';}

  5. 5

    Crea botones para pedir funciones de JavaScript. Las funciones son creadas pero nada ocurre hasta que las pidas en el código HTML. El siguiente código crea botones. Cuando un usuario hace clic en uno de los botones, la función correspondiente de JavaScript se llama: <input type="button" value="Div Color" onclick="divColorChange()" /> <input type="button" value="Paragraph Color" onclick="paraColorChange()" /> <input type="button" value="Span Color" onclick="spanColorChange()" />

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