Tutorial HTML

INICIO HTML Introducción HTML Editores HTML HTML básico Elementos HTML Atributos HTML Encabezados HTML Párrafos HTML Estilos HTML Formato HTML Cotizaciones HTML Comentarios HTML Colores HTML CSS HTML Enlaces HTML Imágenes HTML icono de favoritos HTML Tablas HTML Listas HTML Bloque HTML y en línea Clases HTML Identificación HTML Marcos flotantes HTML HTML JavaScript Rutas de archivo HTML Encabezado HTML Diseño HTML Responsivo HTML Código informático HTML Semántica HTML Guía de estilo HTML Entidades HTML Símbolos HTML Emoticonos HTML Juego de caracteres HTML Codificación de URL HTML HTML frente a XHTML

Formularios HTML

Formularios HTML Atributos de formulario HTML Elementos de formulario HTML Tipos de entrada HTML Atributos de entrada HTML Atributos de formulario de entrada HTML

Gráficos HTML

Lienzo HTML HTML SVG

Medios HTML

Medios HTML Vídeo HTML Audio HTML Complementos HTML HTML de YouTube

API de HTML

Geolocalización HTML Arrastrar/soltar HTML Almacenamiento web HTML Trabajadores web HTML SSE HTML

Ejemplos HTML

Ejemplos HTML Cuestionario HTML Ejercicios HTML Certificado HTML Resumen HTML Accesibilidad HTML

Referencias HTML

Lista de etiquetas HTML Atributos HTML Atributos globales HTML Compatibilidad con navegador HTML Eventos HTML Colores HTML Lienzo HTML Audio/vídeo HTML Tipos de documentos HTML Conjuntos de caracteres HTML Codificación de URL HTML Códigos de idioma HTML Mensajes HTTP Métodos HTTP Convertidor PX a EM Atajos de teclado

Estilos HTML


El atributo HTML stylese usa para agregar estilos a un elemento, como color, fuente, tamaño y más.


Ejemplo

yo soy rojo

Soy azul

Soy grande


El atributo de estilo HTML

La configuración del estilo de un elemento HTML se puede hacer con el styleatributo.

El atributo HTML styletiene la siguiente sintaxis:

<tagname style="property:value;">

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

Aprenderá más sobre CSS más adelante en este tutorial.


Color de fondo

La propiedad CSS background-colordefine el color de fondo de un elemento HTML.

Ejemplo

Establezca el color de fondo de una página en azul polvo:

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

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

</body>

Ejemplo

Establezca el color de fondo para dos elementos diferentes:

<body>

<h1 style="background-color:powderblue;">This is a heading</h1>
<p style="background-color:tomato;">This is a paragraph.</p>

</body>


Color de texto

La propiedad CSS colordefine 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>

fuentes

La propiedad CSS font-familydefine la fuente 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>

Tamano del texto

La propiedad CSS font-sizedefine el tamaño del texto para un elemento HTML:

Ejemplo

<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>

Alineación del texto

La propiedad CSS text-aligndefine la alineación horizontal del texto para un elemento HTML:

Ejemplo

<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>

Resumen del capítulo

  • Use el styleatributo para diseñar elementos HTML
  • Utilizar background-colorpara el color de fondo
  • Usar colorpara colores de texto
  • Usar font-familypara fuentes de texto
  • Usar font-sizepara tamaños de texto
  • Uso text-alignpara alineación de texto

Ejercicios HTML

Ponte a prueba con ejercicios

Ejercicio:

Utilice el atributo HTML y CSS correctos para establecer el color del párrafo en "azul".

<p=";">Esto es un párrafo.</p>