Absatz und Listenbeginn definieren

Status
Nicht offen für weitere Antworten.

intercorni

Erfahrenes Mitglied
Hallo,

ich habe leider unter SelfHTML nichts finden können, wie ich die Höhe eines
Absatzes
Code:
<p>&nbsp; </p>
definieren kann.
Das lässt sich doch bestimmt auch exakt einstellen, oder?

Desweiteren möchte ich den Abstand zwischen dem Text und Beginn einer
Auflistung definieren. Wenn ich eine Liste definieren, dann habe ich
zwischen den normalen Text und dem eigentlichen Beginn der Liste einen
ziemlich großen Absatz. Und diese Absatzhöhe würde ich auch gerne exakt definieren.
Wie läßt sich das machen?

Gruss,

Cornel
 
Hi,

zum Formatieren von Elementen wird CSS verwendet. Hierzu existiert ein spezielles Kapitel bei SelfHTML.

Die Abstände zwischen einer Liste und anderem Text könntest du zum Beispiel über die Aussenabstände
(margin) definieren.
Code:
ul{ margin: 12px 0;}
Im Beispiel würde vor und nach der Liste ein Abstand von 12 Pixeln eingehalten werden.

Ciao
Quaese
 
Hier mal ein kurzes Beispiel vom HTML-Code
Code:
<p class="langertextvortsetzung">
<span class="markiert">ANOMS System 8</span></p>
<ul>
<li class="langeliste">provides environmental planning tools that expand environmental capacity</li>
</ul>

sowie vom CSS:
Code:
.langertextvortsetzung
	{
	margin-top: 0px;
	margin-left: 60px;
	width: 500px;
	font-family: Arial, sans-serif;
	color:#000066;
	text-align: left;
	font-size: 14px;
	vertical-align:bottom;
	}
.markiert
	{
	color:#054F72;
	text-align: left;
	font-weight: bold;
	}
.langeliste
	{ 
	margin-left: 60px;
	margin-top:0px;
	font-family: Arial, sans-serif;
	color:#000066;
	text-align: left;
	font-size: 14px;
	line-height: 20px;
	}
 
Hallo,

ich habe die entsprechenden Elemente deinem Code hinzugefügt und rot markiert.

CSS-Code:
Code:
.langertextvortsetzung
{
margin-top: 0px;
margin-left: 60px;
width: 500px;
font-family: Arial, sans-serif;
color:#000066;
text-align: left;
font-size: 14px;
vertical-align:bottom;
border: 1px solid black;
width: 300px;
height: 20px;
margin: 12px;
}
.markiert
{
color:#054F72;
text-align: left;
font-weight: bold;
}
.langeliste
{
margin-left: 60px;
margin-top:0px;
font-family: Arial, sans-serif;
color:#000066;
text-align: left;
font-size: 14px;
line-height: 20px;
}

Mit width kannst du die Breite festlegen, mit height die Höhe.
Mit margin wird der Außenabstand festgelegt.

Alternativ könntest du auch die Eigenschaften für ul seperat definieren (wie von Quaese angesprochen)
Alternativer CSS-Code:
Code:
.langertextvortsetzung
{
margin-top: 0px;
margin-left: 60px;
width: 500px;
font-family: Arial, sans-serif;
color:#000066;
text-align: left;
font-size: 14px;
vertical-align:bottom;
border: 1px solid black;
width: 300px;
height: 20px;
}
.markiert
{
color:#054F72;
text-align: left;
font-weight: bold;
}
.langeliste
{
margin-left: 60px;
margin-top:0px;
font-family: Arial, sans-serif;
color:#000066;
text-align: left;
font-size: 14px;
line-height: 20px;
}
 
ul { margin: 12px 0;}

Ich habs mit der ersten Variante getestet, es funktionieren aber beide.
Hoffe es hat dir geholfen.

Gruß
Andreas
 
Was Margin bewirkt ist mir schon klar, ich möchte ja den Abstand nicht vergrößern, sondern verkleinern!
Gebe ich allerdings fürs Margin negative Werte ein, so bringt er mir den Zeilenabstand schön durcheinander.
Die Angabe der Breite gab es übrigens schon ;-)

Sieht man hier auch ganz schön: http://de.selfhtml.org/css/eigenschaften/anzeige/list_style_type.htm

Wie läßt sich der Abstand zwischen dem Text (noch keine Liste) und dem Auflistungen entfernen?

Gruss,

Cornel
 
Zuletzt bearbeitet:
Hi,

folgende CSS-Definitionen definieren einen minimalen Abstand.
Code:
.langertextvortsetzung
	{
	margin: 0 0 0 60px;
	width: 500px;
	font-family: Arial, sans-serif;
	color:#000066;
	text-align: left;
	font-size: 14px;
	}
.markiert
	{
	color:#054F72;
	text-align: left;
	font-weight: bold;
	}
.langeliste
	{
	margin: 0 0 0 60px;
	font-family: Arial, sans-serif;
	color:#000066;
	text-align: left;
	font-size: 14px;
	line-height: 20px;
	}
Der Abstand, der jetzt noch existiert, ist auf die Zeilenhöhe von 20 Pixeln zurückzuführen. Wenn
du die Angabe entfernst, sollte kein Abstand mehr zwischen Absatz und Liste zu sehen sein.

Ciao
Quaese
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück