Bar: 1 version importeret

2022-10-28T07:38:09Z

1 version importeret

← Ældre version	Versionen fra 28. okt. 2022, 09:38
(Ingen forskel)

htx_>Bar med 1. aug. 2022, 15:50

2022-08-01T15:50:50Z

Ny side

'''CSS-text''' Er noget man bruger, til at fortælle, hvad for en type tekst, farve, former, og hvor det skal stå. fx em det skal stå midt i, eller ude i siden.
=Tekst udseende=
Der er mange måder at ændre udseende på teksten
==Farver==
Fx farve laver man på denne måde: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_color]

<pre>body {
color:red;
}

h1 {
color:#00ff00;
}

p {
color:rgb(0,0,255);
}</pre>

Hvis man har følgende kode:
<pre>
<body>
<h1>Dette er overskrift 1</h1>
<ul>
<li>En liste</li>
<li>Bliver rød fordi alt i body bliver rødt</li>
<li>Men <a href="#">link</a> får standard link-farve</li>
</ul>
<p>Dette er en paragraph. Teksten er blå. Standard tekst er rødt, men paragraph er defineret til blåt.</p>
<h2>Overskrift 2 bliver også rødt</h2>

</body>
</pre>
Så vil det med de viste CSS angivelser give følgende resultat:

[[Fil:color-eksempel.png]]

==Text-decoration==
Her bestemmer du om du skal have en streg under, igennem eller over teksten: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_text-decoration]
<pre>h1 {text-decoration:overline}
h2 {text-decoration:line-through}
h3 {text-decoration:underline}
h4 {text-decoration:blink}
</pre>

==Text-transform==
Her bestemmer du om, hvordan teksten skal se ud, med "STORT OVER ALT", "Stort For Hvert Ord" eller "småt i alt": [http://www.w3schools.com/cssref/playit.asp?filename=playcss_text-transform]
<pre>h1 {text-transform:uppercase;}
h2 {text-transform:capitalize;}
p {text-transform:lowercase;}
</pre>

=Tekst justering=
Man kan lave om på indstillingerne for hvordan teksten skal formatteres i et afsnit

==Text-align (justering)==
Her bestemmer du om teksten skal ligge til højre, midten eller til venstre: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_text-align]
<pre>h1 {text-align:center}
h2 {text-align:left}
h3 {text-align:right}
</pre>

==Linje-afstand==
Her bestemmer du om hvor meget linjeafstand der skal være: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_line-height]
<pre>p.small {line-height:90%}
p.big {line-height:200%}
</pre>

==Indrykning ved nyt afsnit==
Her bestemmer du om, hvornår teksten skal begynde på den linje du er: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_text-indent]

<pre>p
{
text-indent:50px;
}
</pre>

==Vertikal forskydning/alignment==
Her bestemmer du om hvordan teksterne skal stå i forhold til hinanden. fx om den skal stå forskudt: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_vertical-align&preval=25px]
<pre>img
{
vertical-align:text-top;
}
</pre>

==Afstand mellem bogstaver==
Her bestemmer du om hvor meget mellemrum der skal være imellem hvert bogstav/ord: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_letter-spacing]
<pre>h1 {letter-spacing:2px}
h2 {letter-spacing:-3px}
</pre>

==Afstand mellem ord==
Her bestemmer du om, hvor meget mellemrum der skal være mellem hvert ord. Det er IKKE den samme som den anden, hvor du bestemmer afstand mellem hvert bogstev/tegn: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_word-spacing]
<pre>p
{
word-spacing:30px;
}
</pre>

==Tekst-retning==
her bestemmer du om teksten skal ligge til højre eller venstre: [http://www.w3schools.com/cssref/playit.asp?filename=playcss_direction]

<pre>div
{
direction:rtl;
}
</pre>

==Tekst ombrydning i afsnit==
Her bestemmer du, hvordan teksten skal ombrydes i et afsnit:
[http://www.w3schools.com/cssref/playit.asp?filename=playcss_white-space]
<pre>p
{
white-space:nowrap;
}
</pre>

=Yderlig viden=
Hvis du vil lærer mere, så kan du læse om det inde på www.w3schools.com [http://www.w3schools.com/]

{{Webdesign}}
[[Kategori:CSS Egenskaber]]

CSS-text - Versionshistorie

Bar: 1 version importeret

htx_>Bar med 1. aug. 2022, 15:50