Global-style-2

Sidst opdateret
26. februar 2005

 

Global Style med flere Selectorer

Som nævnt kan man definere stort set alle sine HTML tags i et Style Sheet. Du skal nu udbygge det StyleSheet du lige har indsat på din web-side, idet vi dels ændrer værdierne for BODY-tag og definerer et par HTML koder mere.
  • Åbn din web-side fra før, og vælg HTML-visning( du kan som sagt også åbne siden i Notepad).
  • Rediger og /eller skriv nedenstående koder:

<Style Type="text/css">

egenskaber for <body> tag defineres.

Bemærk font-size!
brug af xx-small, x-small, small, medium, large, x-large m.v. gør teksten skalerbar i browseren.

BODY {
font-family:verdana,arial;
font-size:x-small;
background-color:whitesmoke;
}

egenskaber for H3
som er anvendt i overskriften
Bemærk egenskaben :
'letter-spacing'

 

H3 {
font-family: arial;
font-size: 24px;
letter-spacing:5px;
color: gray;
background:moccasin;
}

egenskaberne
venstremargen,  baggrundsfarve og bredde defineres for <li> tags (punktopstilling)

Bemærk tekstfarve nedarves fra body tag

li {
margin-left:20 px;
background:red;
width:400px;
}

</style>

  • Gem din web-side, og afprøv nu dit Style Sheet i browseren.

Du kan se her hvordan ovenstående Style Sheet virker .
Bemærk virkningen af min definition af <li> på punktopstillingerne .

Vi stopper her i første omgang.
PÅ de næste sider kan du læse om Inline Style Sheets og Linked Style Sheets  

 

© Otto leholt

Til top af siden