Zum Inhalt springen

Bullet list

Erstellt am 14. September 2005 · 11 Antworten · letzte Antwort am 15. September 2005

Tags: Frage

ava99 ·

Hallo zusammen,

habe erst vor kurzem mit Typo3 angefangen
wollte im Content eine Bullet Liste einfügen,
das hat auch so weit funktioniert, allerdings wollte ich die Schriftgröße, Schriftart, Farbe verändern.Mit einer css-Datei, wenn möglich

Vielen Dank schon im voraus

Winddancer ·

hmmm.
müsste eigentlich funktionieren, wenn Du in Deinem Stylesheet ganz einfach die Liste formatierst. mit li ul etc.

hier mal ein Beispiel:

ul {
	list-style-type: bullet;
	padding-left: 10px;
	padding-right: 10px;
	margin: 0px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size:12px;
	text-decoration: none;
}

Und dann müsstest Du natürlich noch die Listenelemente formatieren...

Winddancer ·

also wenn die Liste (ul) und die Listenelemente (li) keine extra Klassendefinitionen haben (musst mal in den ausgegebenen Quelltext schauen), sollte es ausreichen das ganze im Stylesheet zu definieren.

aaron ·

Hi

@Winddancer:

Mich plagt das gleich Problem..
Ich habe ul {..} innerhalb der CSS Datei eingesetzt.
Die ul Formatierung wird vorgenommen. Jedoch bleibt die Schriftgröße unverändert !

Abgesehen davon nimmt das Ganze Einfluß auf Sitemap.

Würde mich über eine Lösung auch freuen 🙂

Gruß
Aaron

Winddancer ·
aaron schrieb

Hi

@Winddancer:

Mich plagt das gleich Problem..
Ich habe ul {..} innerhalb der CSS Datei eingesetzt.
Die ul Formatierung wird vorgenommen. Jedoch bleibt die Schriftgröße unverändert !

Abgesehen davon nimmt das Ganze Einfluß auf Sitemap.

Würde mich über eine Lösung auch freuen 🙂

Gruß
Aaron

poste doch mal den abschnitt über listen.

die sitemap wird wahrscheinlich deshalb beeinflusst, weil sie ebenfalls auf listen aufgebaut ist. Abhilfe schafft hier die Deklaration einer zweiten Klasse für eine Liste.

Bsp. <ul class="sitemap">

im stylesheet gibst du das dann auch so an

ul.sitemap {
font-family:verdana;
...
}

für die listenelemente dann einfach

ul.sitemap li {
...
}

damit werden dann nur die list elemente in der sitemap formatiert.

oder natürlich einfach ohne das .sitemap für alle anderen listen.

ava99 ·

Danke Leute,

bei mir ergibt sich da keinerlei veränderung wenn ich dies einfüge, außer dass sich die Sitemap verschiebt, aber bullet liste ohne Veränderung

Gruß ava99

aaron ·

Hi.
thx für die schnelle Antwort 🙂

Sitemap CSS:

.level1 li {
	font-size : 12px;
	margin-top: 30px;
	margin-bottom: 25px;
	margin-left: -25px;
	padding-left: 8px;
}
.level2 li {
	margin-left: -30px;
	margin-top: -20;
}
.level3 li {
	margin-left: -30px;
	margin-top: -20;
}
.level4 li {
	margin-left: -30px;
	margin-top: -20;
}

Sitemap Typoscript:

#######
# Sitemap
#######
#Das noBlur = 1 wird nur benötigt, wenn die Seite möglichst barrierefrei sein soll.
tt_content.menu.20.2.1.noBlur = 1
tt_content.menu.20.2.1.wrap = <ul class="level1"> | </ul>
tt_content.menu.20.2.1.NO.allWrap = <li> | </li>
tt_content.menu.20.2.2.noBlur = 1
tt_content.menu.20.2.2.wrap = <ul class="level2"> | </ul>
tt_content.menu.20.2.2.NO.allWrap = <li> | </li>
tt_content.menu.20.2.3.noBlur = 1
tt_content.menu.20.2.3.wrap = <ul class="level3"> | </ul>
tt_content.menu.20.2.3.NO.allWrap = <li> | </li>
tt_content.menu.20.2.4.noBlur = 1
tt_content.menu.20.2.4.wrap = <ul class="level3"> | </ul>
tt_content.menu.20.2.4.NO.allWrap = <li> | </li>

Muss kurz einkaufen gehen.. werde danach dein Vorschlag testen 🙂

Gruß
Aaron

Winddancer ·
aaron schrieb

Muss kurz einkaufen gehen.. werde danach dein Vorschlag testen 🙂

Mach das mal.

So sieht das für mich schon ziemlich gut aus.

Wenn Du noch Listitems (sowas wie kreise oder ecken) davor haben willst, fehlt noch die definition:

ul.level1 {
list-style-type: bullet;
}

(oder bullet mit anderem wert ersetzen. was man halt am liebsten hat.

Für alle ANDEREN listen musst Du eine unabhängige Definition machen.

ul {
...
}

generell halte ich es für sehr sinnvoll immer hierachisch zu arbeiten.

sprich so:

ul{
...
}

ul li{
...
}

ul.level1 {
...
}

ul.level1 li{
...
}

Der Vorteil liegt auf der Hand. Du musst nur einmal, nämlich beim übergeordneten Element eine Klasse definieren. Eingebettete Elemente, wie hier die li Listenelemente übernehmen dann entsprechend die Formatierung. Spart Platz und schafft Ordnung.

Grüße

Sven

ava99 ·

Hallo Leute ..

keiner eurer Vorschlälge hat mir bisher weitergeholfen, vielen dank nochmal dafür.
Kann mir da draußen denn niemand helfen bei meinen Problem ??

Gruß
ava99

Winddancer ·
ava99 schrieb

Hallo Leute ..

keiner eurer Vorschlälge hat mir bisher weitergeholfen, vielen dank nochmal dafür.
Kann mir da draußen denn niemand helfen bei meinen Problem ??

Gruß
ava99

Also ich verstehe im Moment Dein Problem noch nicht so richtig. Vielleicht kannst Du das noch etwas detailierter ausführen?

ava99 ·

Hallo ...

das werde ich gerne tun
Ich möchte die Schriftart, Schriftfarbe, Postition der Bullet liste in einer css datei formatieren können. Dein post bzgl. Liste formatierung hat keinerlei Veränderung bewirkt. Wenn ich eine klasse in css definiere kann wie kann ich in TS setup darauf zugreifen, dass diese explizit nur für bullet list gilt ??

tt_content.bullets.20 = <ul class="sitemap">   
      |</ul>

Vielen Dank schon im voraus für deine Geduld
Winddancer