ilj@flowsim.se
stylesheets på svenska 5 - stilmallar
stylesheets: css/ stilmallar - text

UPPERCASE - lowercase



 

 
TEXT
 
word-spacing: ...
letter-spacing: ...
text-decoration: ...
vertical-align: ...
text-transform: ...
text-align: ...
text-indent: ...
line-height: ...

 

 
word-spacing
 
Om man vill reglera avståndet mellan ord kan man skriva t ex så här:
 
<STYLE TYPE="text/css">
<!--
BLOCKQUOTE { word-spacing: 0.6em }
-->
</STYLE>

 
Resultatet ser ut så här:
 
så här ser en word-spacing på 0.6 em ut

 
Avståndet mellan de ord som placeras mellan BLOCKQUOTE blir större än avståndet mellan orden i omgivande text.

 

 
letter-spacing
 
Man kan reglera avståndet mellan tecken så här:
 
<STYLE TYPE="text/css">
<!--
H3 { letter-spacing: 10px }
-->
</STYLE>

 
Här ökas avståndet mellan bokstäver och andra tecken som placerats mellan H3-taggar med 10 pixel.
 
Här följer order letter-spacing med 10 extra pixel mellan bokstäverna:
 
letter-spacing
 
Vill man minska avståndet kan man använda ett negativt värde, t ex -0.1cm.
 
Möjliga värden efter
word-spacing: och letter-spacing: är förutom längdangivelse även:
 
normal

 

 
text-decoration
 
Om man vill att alla H1-rubriker ska vara understrukna kan man skriva så här:
 
<STYLE TYPE="text/css">
<!--
H1 { text-decoration: underline }
-->
</STYLE>

 
Stryka över all text mellan H1-taggar kan man göra genom att skriva så här:
 
<STYLE TYPE="text/css">
<!--
H1 { text-decoration: line-through }
-->
</STYLE>

 
överstruken text

 
Möjliga värden efter
text-decoration: är:
 
none | underline | overline | line-through | blink
 
text med streck ovanför - overline
 
blink-exempel

 

 
vertical-align
 
Med hjälp av
vertical-align: kan man placera text och bild i höjdled, t ex
 
<STYLE TYPE="text/css">
<!--
.asterisk { vertical-align: super }
-->
</STYLE>

 
Möjliga värden efter
vertical-align: är:
 
baseline | middle | sub | super | text-top | text-bottom
 
text med asterisk


 

 
text-transform
 
Små bokstäver (gemener) mellan BLOCKQUOTE-taggar blir stora (VERSALER) om man skriver så här:
 
<STYLE TYPE="text/css">
<!--
BLOCKQUOTE { text-transform: uppercase }
-->
</STYLE>

 
Första bokstaven i varje ord som står mellan H1-taggar blir stor (VERSAL) om man skriver så här:
 
<STYLE TYPE="text/css">
<!--
H1 { text-transform: capitalize }
-->
</STYLE>

 
Möjliga värden efter
text-transform: är:
 
capitalize | uppercase | lowercase | none

 

 
text-align
 
Med hjälp av text-align: kan man placera text och bild i sidled, t ex
 
BODY { text-align: justify }
H1 { text-align: left }
H2 { text-align: right }

 
Möjliga värden efter
text-align: är:
 
left | right | center | justify
 
justify
ser till så att både vänster- och högermarginalerna blir jämna.

 

 
text-indent
 
Första raden i varje nytt stycke börjar två centimeter längre in på sidan än övriga rader om man skriver så här:
 
<STYLE TYPE="text/css">
<!--
P { text-indent: 2cm }
-->
</STYLE>

 

 
line-height
 
Med hjälp av
line-height: kan man reglera avståndet mellan raderna, t ex
 
PRE { line-height: 130% }

 
Möjliga värden efter
line-height: förutom längdangivelse är:
 
normal

 

 
OBS! Stilmallar fungerar i varierande grad i nyare webbläsare (Netscape 4.0+ o MIE 4.0+); det är definitivt bäst att kolla sidan i åtminstone både Netscape Navigator och MIE.
 
Mer om stilmallar under rubriken STYLESHEETSwww.flowsim.se

 

Sidan gjordes av
 
ilj@flowsim.se
 

 
Senast ändrad 13 mars 2004
Den här sidan hör hemma i ett ramsystem hos:
www.flowsim.se
Stilmallar på svenska