w3docs logo
¿Qué etiqueta HTML se usa para definir una hoja de estilo interna?
Iniciar Quiz - "CSS Fundamentos"

Uso de la etiqueta <style> en HTML para definir una hoja de estilo interna

La etiqueta HTML correcta para definir una hoja de estilo interna es <style>. Esta etiqueta se utiliza para incrustar hojas de estilo CSS en el documento HTML. El CSS definido de esta manera se aplica al documento HTML del que forma parte y a ningún otro.

Ejemplo de uso de la etiqueta &lt;style&gt;

Aquí se muestra un ejemplo de cómo se podría usar la etiqueta <style> para definir una hoja de estilo interna.

<!DOCTYPE html>
<html>
<head>
<title>Título de la página</title>
<style>
    body {
       background-color: lightblue;
    }
    h1 {
       color: navy;
       margin-left: 20px;
    }
</style>
</head>
<body>
<h1>Este es un ejemplo del uso de CSS interno</h1>
<p>El CSS interno se define en la sección head del código HTML usando la etiqueta `style`.</p>
</body>
</html>

En este ejemplo, la etiqueta <style> contiene dos reglas CSS. La primera cambia el color de fondo de toda la página (el body), mientras que la segunda define el color y margen izquierdo de los titulares de primer nivel (h1).

Mejores prácticas al usar la etiqueta &lt;style&gt;

Si bien la etiqueta <style> permite la inclusión de CSS directamente en el documento HTML, es importante recordar algunas mejores prácticas al utilizarla:

  • Mantén las hojas de estilo internas al mínimo: Aunque las hojas de estilo internas pueden ser útiles en algunas situaciones, como cuando se necesita estilizar una única página, es generalmente mejor usar hojas de estilo externas. Esto permite que los estilos sean reutilizados en múltiples páginas y hace que el HTML sea más fácil de leer y mantener.
  • Evita estilos en línea: Aunque HTML permite estilos en línea usando el atributo style, este método debería evitarse cuando sea posible. Los estilos en línea tienen una alta especificidad, lo que significa que pueden sobrescribir los estilos definidos en otras partes y pueden hacer que el mantenimiento del CSS sea más difícil.

Related Questions

¿Te resulta útil?