Passagens HTML-guide: Stylesheets
Stylesheets är ett relativt nytt sätt att formge websidor på. Ett problem med "vanlig" HTML är ju att det kan vara klurigt att få sidorna att se likadana ut i olika webläsare. Med stylesheets kan du enkelt bygga websidor med en precision som liknar tryckkonstens. Det vill säga bild och text på rätt plats och med rätt storlek.
Tänk på att...
Stylesheets endast fungerar i:
– Till viss del i Internet Explorer 3, men fullt ut i senare versioner
– Netscape 4 (communicator), och senare.
Om dina stylesheets inte beter sig som du vill, så kan det bero på att de "krockar" med den vanliga HTML-koden. Det gäller som sagt att ha en smula tålamod.
Här ser du en översikt av de vanligaste stylesheet-attributen som du kan använda dig av:
| Attribut |
Förklaring och exempel |
| Color |
Anger textfärgen
{Color: #003366} |
| Background |
Anger bakgrundsbild eller färg
{Background: URL(http://bildens adress)}
{Background: #FFFFFF} |
| Font-family |
Anger typsnitt
{Font-family: Geneva, Arial, Helvetica, sans-serif} |
| Font-size |
Textstorlek
{Font-size: 24pt} |
| Font-style |
Normal eller kusiv text
{Font-style: normal} |
| Font-weight |
Typsnittets tjocklek
{Font-weight: bold} |
| Text-align |
Textens vertikala justering
{Text-align: center} |
| Text-decoration |
Text-dekoration
{Text-decoration: underline} |
| Text-indent |
Avstånd till vänstermarginalen
{Text-indent: 2cm} |
| Margin-left |
Vänstermarginalens storlek
{Margin-left: 2cm} |
| Margin-right |
Högermarginalens storlek
{Margin-right: 2cm} |
| Margin-top |
Övre marginalens storlek
{Margin-top: 2cm} |
| Line-height |
Radavstånd
{Line-height: 12pt} |
Klicka här för en mer detaljerad översikt som du kan spara eller skriva ut.
Så här kan ett enkelt stylesheet se ut:
.style { Font-size:24pt; Font-weight:medium; Color:#000000;
Font-family: Geneva, Arial, Helvetica, sans-serif }
Lägg märke till att man avänder semikolon för att separera attributen från varandra .
Observera att Internet Explorer 3 har några fel i sin tolkning av stylesheets. Detta gör att du måste ange font-weight och font-sizeattributen först i din definition samt att du inte kan ange fler än ett typsnitt i samma definition.
Om du ändå vill ange flera typsnitt och ha stylesheets i Explorer 3 så får du göra det med FACE-attributet i <FONT>-tagen.
T ex <FONT FACE="Verdana, Geneva, Arial">
Fortsättning >>
|
