CSS-Scripte Text Gestalten (Formatieren) mit CSS
 

 

Textgestaltung mit CSS

 
   
Texte formatieren und Gestalten mit CSS:
Eine Überschrift mit CSS:
<body>
<h3 style="color:#FF00FF;font-style:italic;font-size:x-large">
Die formatierte Überschrift mit CSS
</h3>
</body>
Die Überschrift ist italic (kursiv) und hat die Farbe blau. mit h3 wird die Größe der Überschrift bestimmt. 
   
Formatierte Überschrift in einem Rahmen:
In den Headerbereich der Seite.
<style type="text/css">
<!--
H1
{
color: yellow;
text-align: center;
border-color: Blue;
border-style: groove;
}
// -->
</style>
In den Bodybereich der Seite
<h1> Formatierte Überschrift in einem Rahmen.</h1>
Zunächst wird der HTML-TAG (in diesem fall H1) vorgegeben der formatiert werden soll.

Nun wird der Text mit text-align: center mittig gesetzt.

Die Rahmenfarbe wird hier über border-color: mit blau angegeben.

Und mit border-style: wird die Art des Rahmens festgelegt.

Text mit einer Hintergrundfarbe:
In den Headerbereich der Seite.
<style type="text/css">
<!--
h1{
background-color:#000000;
color:#ffffff;
}
-->
</style>
In den Bodybereich der Seite.
<h1>Das ist nun die Überschrift</h1>
Hier wird wieder der HTML-TAG H1 vorgegeben der Formatiert werden soll. Die Hintergrundfarbe des Textes wird mit background-color festgelegt und die Textfarbe mit color:.
   
Text mit einem Hintergrundbild:
In den Headerbereich der Seite.
<style type="text/css">
<!--
h1{
background-image:url(bg.gif);
}
-->
</style>
In den Bodybereich der Seite.
<h1>Das ist nun die Überschrift</h1>
   
Absatz mit einer Hintergrungrafik:
In den Headerbereich der Seite.
<style type="text/css">
<!--
P.absatz
{
background-image: url(bg.jpg);
background-repeat: no-repeat;
}
// -->
</style>
In den Bodybereich der Seite.
<p class="absatz"> <font color="#000000">
Das Hintergrundbild erscheint nur in diesem Absatz.<br>u.s.w</p>
Hier wird nun die Klasse P.absatz Formatiert.