Capítulo 6 - Exemplos de Desenhos "Stylesheet"
Exemplo 2 - Externo
Neste exemplo baseado em "stylesheet" externo, são inseridos vários estilos num só documento HTML
DOCUMENTOS CSS
titulo.css
DIV.titulo { width:
100%; }
DIV.titulo H1 { font-size: 2em;
background:
darkblue;
font-family: Garamond;
color: white;
text-align:
center;
width: 100%;
margin-left: auto;
margin-right: auto;
}
corpo.css
A:link { color: #900
}
A:visited, A:active { color: #009 }
DIV.corpo {
margin-left:
0.2em;
margin-right: 0.2em; }
padding-left: 0.0em;
padding-right: 0.0em; }
DIV.corpo H2 {
font-family: "Arial
Black",Arial,sans-serif;
padding-top: 0.2em;
padding-bottom:
0.2em;
color: white;
text-align: left;
background:
red;
DIV.corpo P {
padding-top: 0em;
padding-bottom:
0em;
margin-bottom: 0em;
margin-top: 0.2em; }
text-align: justify;
DIV.corpo H1 {
display: block;
text-align:
right;
color: #dddddd;
font-size: 80pt;
font-family:
Arial,helvetica,sans-serif; }
DOCUMENTO HTML
<HTML>
<HEAD>
<TITLE>Exemplo de página HTML usando vários estilos externos<TITLE>
<LINK REL="stylesheet" TYPE="text/css" HREF="./titulo.css">
<LINK REL="stylesheet" TYPE="text/css" HREF="./corpo.css">
</HEAD>
<BODY BGCOLOR="ffffff">
<DIV ALIGN="center" CLASS="titulo">
<H1 ALIGN="center">Exemplo de "Stylesheet" Externo</H1>
</DIV>
<DIV ALIGN="center" CLASS="corpo">
<H2>Estilos CSS</H2>
<P>
Neste exemplo baseado em "stylesheet" externo, são inseridos vários estilos num só documento HTML. Esta é uma das vantagens de se usar CSS nas páginas HTML. Além do documento apresentar dois ou mais estilos diferentes para um mesmo elemento, torna-se mais simples descrevê-lo, e ainda poderá usar os estilos em outras páginas, juntos ou em separados.
</P>
<CENTER><A HREf="javascript:history.go(-1)">Volta para o Curso</a> </CENTER>
</DIV>
</BODY>
</HTML>
 | |  |
