Textformat versetzen

[RageNo1]

Hallo ich möchte gerne einen versetzten Text haben
bei dem es einen Überbegriff gibt und dann jeweils Unterbegriffe.

Was ich genau meine ist im Anhang als Bild dargestellt.

Hier mal mein Code für den Text:

#main {
	FONT-SIZE: 15px;
	COLOR: #000000;
	FONT-FAMILY: Geneva, Arial, Helvetica, sans-serif;
}

Ich müsste ja dann logischerweis diesen Code Zweimal haben
bei dem halt noch ein Befehl fehlt welcher den Text so versetzt
oder liege ich da ganz falsch?

Mfg Ragey

 

[Maik]

Empfehle eine Liste zur Textstruktuierung in Kombination mit CSS, das u.a. auch spezielle Listenformatierungen bietet.

 

[RageNo1]

Gibt es auch noch andere möglichkeiten?

 

[Maik]

Mit margin-left kannst du Elemente links einrücken.

CSS-Code:

p.main
{
font-size: 15px;
color: #000000;
font-family: Geneva, Arial, Helvetica, sans-serif;
}

p.sub
{
margin-left: 10px;
font-size: 15px;
color: #000000;
font-family: Geneva, Arial, Helvetica, sans-serif;
}

HTML-Source:

<p class="main">Punkt 1</p>
   <p class="sub">Unterpunkt 1.1</p>
   <p class="sub">Unterpunkt 1.2</p>
   <p class="sub">Unterpunkt 1.3</p>

<p class="main">Punkt 2</p>
   <p class="sub">Unterpunkt 2.1</p>
   <p class="sub">Unterpunkt 2.2</p>
   <p class="sub">Unterpunkt 2.3</p>

 

[RageNo1]

Funktioniert aber nun habe ich zwischen den Zeilen soviel Platz,
kann man das noch ändern?

Punkt 1

Unterpunkt 1.1

Unterpunkt 1.2

Unterpunkt 1.3

Punkt 2

Unterpunkt 2.1

Unterpunkt 2.2

Unterpunkt 2.3

 

[Maik]

CSS-Code:

p.main
{
font-size: 15px;
color: #000000;
font-family: Geneva, Arial, Helvetica, sans-serif;
}

p.sub
{
margin-left: 10px;
font-size: 15px;
line-height: 0;
color: #000000;
font-family: Geneva, Arial, Helvetica, sans-serif;
}