css títol pàgina. css títol pàgina @import "estil.css" );
TRANSCRIPT
CSS
<head>
<title>Títol pàgina</title>
</head>
CSS
<head>
<title>Títol pàgina</title>
<style type="text/css" media="screen"> @import "estil.css" );
</style>
</head>
CSS
<head>
<title>Títol pàgina</title>
<style type="text/css">
p {margin-left: 20px}
body {background-image: url("images/back40.gif")}
</style>
</head>
CSS
<p style="color: sienna;
margin-left: 20px">...</p>
CSS
body{
color: #666;
background: #e5e5e5;
font: Georgia, serif;
}
El fons
body {
background: color imatge repetició? fixe? posició
} • Color:
– aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red,
silver, teal, white, yellow – #rgb, #rrggbb
El fons
body {
background: color imatge repetició? fixe? posició
} • Imatge: url("banner.jpeg")
– repeat repeat-x repeat-y– fixed scroll– Posició: % %, llarg llarg, top center bottom, left center right
El fons
body { background: red }
p { background: url("chess.png") gray 50% repeat fixed }
Tipografia
p {
font: estil variant pes tamany/alçada família
} • Estil: normal italic oblique• Variant: normal small-caps• Pes: lighter normal bold bolder
100 … 400 … 700 … 900
Tipografia
p {
font: estil variant pes tamany/alçada família
} • Tamany/alçada
– Absolut: xx-small x-small small medium large x-large xx-large
– Relatiu: larger smaller– Em’s, ex’s, px’s– % 10% … 90% 100% 110%...
Tipografia
p {
font: estil variant pes tamany/alçada família
} • Família
– serif, sans-serif, cursive, fantasy, monospace– Helvetica, Arial, “Courier New”, “Times New Roman”…
Tipografia
p { font: 12px/14px sans-serif }
p { font: 80% sans-serif }
p { font: x-large/110% "New Century Schoolbook", serif }
p { font: bold italic large Palatino, serif }
p { font: normal small-caps 120%/120%
fantasy }
Tipografia
p {
letter-spacing; word-spacing; text-align; text-decoration;text-indent; text-transform
}• Espaiat: en em’s, ex’s, px’s (+ i -)• text-align: left right center justify• text-decoration:
none underline overline line-through
Tipografia
p {
letter-spacing; word-spacing; text-align; text-decoration;text-indent; text-transform
}• text-indent: em’s ex’s, px’s, %• text-transform:
capitalize uppercase lowercase none
Vores
img {
border: amplada estil color
}• Amplada: thin, medium, thick, em’s ex’s i px’s
• Estil: none, dotted, dashed, solid,double, groove, ridge, inset, outset
• Color…