Aula 6Html – 6
CSS
Prof. Paulo Cesar F. De Oliveira, BSc, PhD
05/08/16 © P C F de Oliveira 2016 1
05/08/16 © P C F de Oliveira 2016 2
Lembrete
05/08/16 © P C F de Oliveira 2016 3
Conceito
05/08/16 © P C F de Oliveira 2016 4
O chapéu está legal. Que tal
colocar um pouco mais de estilo no
seu “HTML”?
Uma frase simples.
05/08/16 © P C F de Oliveira 2016 5
Uma frase simples.
05/08/16 © P C F de Oliveira 2016 6
Uma frase simples.
05/08/16 © P C F de Oliveira 2016 7
Uma frase simples.
05/08/16 © P C F de Oliveira 2016 8
Uma frase simples.
05/08/16 © P C F de Oliveira 2016 9
05/08/16 © P C F de Oliveira 2016 10
quarto { cortina: azul; carpete: cinza;
}
banheiro { cortina: rosa; azulejo: branco;
}
05/08/16 © P C F de Oliveira 2016 11
seletor { property: value; }
declaração
propriedade valor
05/08/16 © P C F de Oliveira 2016 12
seletor { property1: value1;property2: value2;property3: value3;
}
bloco de declaração
05/08/16 © P C F de Oliveira 2016 13
h1 { color: green;
}
p {font-size: small;font-family: sans-serif;
}
05/08/16 © P C F de Oliveira 2016 14
Sans-serif
Serif
05/08/16 © P C F de Oliveira 2016 15
p {background-color: red; border: 1px solid gray;
}
05/08/16 © P C F de Oliveira 2016 16
h1, h2 {font-family: sans-serif; color: gray; border-bottom: 1px solid black;
}
05/08/16 © P C F de Oliveira 2016 17
05/08/16 © P C F de Oliveira 2016 18
<p style="color: blue;">Lorem ipsum dolor.</p>
05/08/16 © P C F de Oliveira 2016 19
<head> <title>Um título qualquer</title> <style type=“text/css”>
p { color: blue; } </style>
</head>
05/08/16 © P C F de Oliveira 2016 20
<head> <title>Um título qualquer</title> <link type=“text/css”rel=“stylesheet” href=“estilo.css”>
</head>
05/08/16 © P C F de Oliveira 2016 21
Em linha
Folha de Estilo Externa
Folha de Estilo Interna
Default do Navegador (Browser)
CSS Zen Garden (www.csszengarden.com)
CSS Beauty (www.cssbeauty.com)
05/08/16 © P C F de Oliveira 2016 22