Estructura e sintaxe

Anterior - Seguinte

Tipos de follas de estilos

Follas de estilos externas

As definicións dos estilos realízanse nun ficheiro aparte. O ficheiro debe ter extensión css.

Na páxina html hai que indicar na sección de cabeceira (<head> e </head>) onde se atopa o ficheiro de estilos a utilizar.

Unha folla de estilos externa é ideal cando o estilo vaise aplicar a varias páxinas web xa que, cambiando un só ficheiro póde cambiarse a apariencia de toda a Web.

Folla de estilos interna

Unha folla de estilos interna debe utilizarse cando un único documento HTML ten un único estilo. Defínense utilizando a etiqueta <style> na cabeceira do HTML, como a seguinte:

<head>
  <style type="text/css">
  <!--
    ul {
      color: yellow;
    }
    p {
      font-size: 14pt;
    }
    body{
      background-color: black;
      font-size: 12pt;
    }
  -->
  </style>
</head>

O navegador lerá as definicións de estilos e daralle forma ao documento de acordo a elas.

Exercicio

Copia o código anterior da folla de estilos interna (desde <style type="text/css"> ata </style>) na cabeceira do ficheiro de proba do tutorial de HTML e comproba os cambios no navegador.


Sintaxe

As definicións CSS constan de tres partes: un selector, unha propiedade e un valor:

selector {
  propiedade: valor;
}

O selector normalmente é unha etiqueta HTML á que lle queremos definir o estilo. A propiedade é o atributo que desexamos cambiar e só pode tomar un valor. A propiedade e o valor sepáranse mediante dous puntos e tras o valor escríbese un punto e coma. Cada selector pode ter varios pares propiedade-valor enmarcados entre chaves.


Anterior - Seguinte