Lembretes CSS

<< Click to Display Table of Contents >>

Navigation:  CSS >

Lembretes CSS

Previous pageReturn to chapter overviewNext page

Como usar

 

<html>

  <head>

    <title>Meu documento</title>

    <link rel="stylesheet" type="text/css" href="pasta/arquivo.css" />

 

  </head>

  <body>

  ...

 

arquivo.css

 

body {

  background-color: #FF0000;

}

 

 

Cores

 

body {

 background-color: #FFCC66;

}

 

h1 {

 color: #990000;

 background-color: #FC9804;

 

}

 

Imagem de fundo

 

body {

 background-color: #FFCC66;

 background-image: url("butterfly.gif");

 background-repeat: no-repeat;

}

 

background-repeat: repeat-x

A imagem se repete na horizontal

background-repeat: repeat-y

A imagem se repete na vertical

background-repeat: repeat

A imagem se repete na tanto na horizontal como na vertical

background-repeat: no-repeat

A imagem não se repete

background-attachment: scroll

A imagem rola com a página

background-attachment: fixed

A imagem é fixa

background-position: 2cm 2cm        

A imagem é posicionada a 2 cm da esquerda e 2 cm para baixo na página

background-position: 50% 25%

A imagem é centrada na horizontal e a um quarto (25%) para baixo na página

background-position: top right

A imagem é posicionada no canto superior direito da página

 

Fonte

 

h1 {font-family: arial, verdana, sans-serif;}

h2 {font-family: "Times New Roman", serif;}

 

Especializar tag

 

CSS

 

h2.azul     { color: blue;   }

h2.vermelho { color: red;    }

h2.amarelo  { color: green;  }

h2          { color: purple; }

 

HTML

 

<html>

  <head>

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

  </head>

 

  <body>

    <h2 class="azul">Azul</h2>   

    <p> texto </p>

  

    <hr>

    <h2 class="vermelho">Segundo</h2>   

    <p> texto </p>

 

    <h2 class="amarelo">Terceiro</h2>   

    <p> texto </p>

 

    <h2>Generico</h2>   

    <p> texto </p>

</body>

</html>

 

Como fica:

 

vai para las vegas

Azul

texto


Segundo

texto

Terceiro

texto

Generico

texto