Los últimos tutoriales de desarrollo web

Estilos HTML

Estilos HTML

I am red

I am blue

Inténtalo tú mismo "

El HTML Style Atributo

Ajuste del estilo de un elemento HTML, se puede hacer con el style atributo.

El atributo de estilo HTML tiene la siguiente sintaxis:

style=" property : value; "

La property es una propiedad CSS. El value es un valor CSS.

Va a aprender más acerca de CSS más adelante en este tutorial.


HTML Color de fondo

El background-color propiedad define el color de fondo de un elemento HTML:

Este ejemplo establece el fondo de una página a gris claro:

Ejemplo

<body style="background-color:lightgrey;">

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>
Inténtalo tú mismo "

Color de texto HTML

El color propiedad define el color del texto de un elemento HTML:

Ejemplo

<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>
Inténtalo tú mismo "

Fuentes HTML

La font-family propiedad define el tipo de letra que se utilizará para un elemento HTML:

Ejemplo

<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>
Inténtalo tú mismo "

Tamaño de texto HTML

El font-size propiedad define el tamaño del texto de un elemento HTML:

Ejemplo

<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>
Inténtalo tú mismo "

Alineación de texto HTML

El text-align propiedad define la alineación del texto horizontal para un elemento HTML:

Ejemplo

<h1 style="text-align:center;">Centered Heading</h1>
<p>This is a paragraph.</p>
Inténtalo tú mismo "

Resumen del capítulo

  • Utilice el style de atributos para elementos de estilo HTML
  • Utilice background-color para el color de fondo
  • Utilizar color para los colores de texto
  • Utilice font-family de las fuentes de texto
  • Usar font-size para tamaños de texto
  • Utilizar text-align para la alineación del texto

Ponte a prueba con los ejercicios!

Ejercicio 1 » Ejercicio 2» Ejercicio 3 » Ejercicio 4» Ejercicio 5 » Ejercicio 6»