Lección 2: Estructura

sintaxis


selector {
    estilo: valor;
}

En el siguiente ejemplo cambiamos el tamaño de la tipografía en todos los párrafos.


p {
    font-size: 3rem;
}

Se dará el caso de varios valores u otros estilos.


p {
    font-size: 3rem;
    border: 1px solid black;
}

comentarios


/* Estilos de tabla */
table {
    /* Añade un margen izquierdo de 2.5rem */
    margin-left: 2.5rem;
    /* color: pink */
}

style

Si deseas incrustar los estilos en el propio documento HTML puedes hacerlo dentro de <head> con la etiqueta <style>.

<head>
  <style>

  body {
      color: yellow;
  }

  </style>
</head>

El CSS puede estar vinculado desde un archivo externo. Dentro de <head> usa <link> con la ruta relativa al fichero.

<head>
    <link rel="stylesheet" type="text/css" href="css/main.css">
</head>

En el siguiente ejemplo podemos ver un caso real de una sencilla web que hace uso de 2 normalizadores.

<head>
    <!-- Normalizador normalize.css: Equilibra los estilos entre los Navegadores -->
    <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css">
    <!-- Normalizador symbiosis.css: Arregla problemas en versiones de Smartphone -->
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/sapps-studio/symbiosis-css/symbiosis.min.css">
    <!-- Tú CSS -->
    <link rel="stylesheet" type="text/css" href="css/main.css">
</head>

Un normalizador es un conjunto de CSS que modifica los estilos generales para equilibrar el diseño en todos los navegadores evitando discrepancias visuales.

¿Te ayudo?

  • 1 café: ¡Gracias por el apoyo! Te ayudo a que esta web siga estando online pagando los servidores.
  • 2 cafés: Respondo a una duda en los comentarios.
  • 4 cafés: Te corrijo una actividad y te envío feedback.
Comprame un café

Comentarios

{{ comments.length }} comentarios

Nuevo comentario

Nueva replica  {{ formatEllipsisAuthor(replyComment.author) }}

Acepto la política de Protección de Datos.

Escribe el primer comentario