COMO USAR CSS3
Existem três formas inserir css3
CSS externo
Css interno
Css embutido
CSS
externo
Com folha de estilo esterno você pode alterar site todo ou
um arquivo.
<!DOCTYPE html>
<html>
<head>
<link
rel="stylesheet" href="folha1.css">
</head>
<body>
<h1>Título da página</h1>
<p>Primeiro parágrafo. </p>
</body>
</html>
A página do html você salva com extensão nome.html, já com
css você vai salvar com extensão nome.css.
Criando folha de
estilo e salvar como folha1.css
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}
CSS
INTERNO
Aqui css vai ficar dentro <head> </head>
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color:
linen;
}
h1 {
color: maroon;
margin-left: 40px;
}
</style>
</head>
<body>
<h1>Tìtulo da página</h1>
<p>Primeiro parágrafo. </p>
</body>
</html>
CSS
EMBUTIDO
Aqui você você vai usar css dentro de cada elemento.
<!DOCTYPE html>
<html>
<body>
<h1 style="color:blue;text-align:center;">Título
da página</h1>
<p style="color:red;">Primeiro parágrafo. </p>
</body>
</html>
Múltiplas Folhas de
Estilo
folha de estilo
externa
h1 {
color: navy;
}
folha de estilo
interna
h1 {
color: orange;
}
Se estilo interno
for definido após o estilo externo quem vai permanecer é o interno.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet"
type="text/css" href="mystyle.css">
<style>
h1 {
color: orange;
}
</style>
</head>
<body>
<h1>Este é um cabeçalho</h1>
<p>O estilo deste documento é uma combinação de uma
folha de estilo externa e uma folha de estilo interna</p>
</body>
</html>
Ordem em cascata
um estilo embutido tem a
prioridade mais alta e substituirá os estilos externos e internos e os padrões
do navegador.