myGully.com

myGully.com (https://mygully.com/index.php)
-   Entwicklung & Programmierung (https://mygully.com/forumdisplay.php?f=72)
-   -   html <ul> style (https://mygully.com/showthread.php?t=2122695)

edipp 20.09.10 14:52

html <ul> style
 
Hallo,
Ich arbeite auf meiner Homepage mit einem Frameset, eins davon nutze ich als Menü.
Dabei arbeite ich mit einer Unordered list. Jetzt habe ich aber folgendes anliegen: Ich möchte dass bestimmte Menü einträge einem anderen untergeordnet erscheinen.

grob sieht mein code wiefolgt aus:
[HTML]<ul class="menue">
<li><a title="Startseite" href="startseite.html" target="mainframe">&raquo; Startseite</a></li>
<li><a title="übergeordnet1" href="übergeordnet1.html" target="mainframe">&raquo; übergeordnet1</a></li>
<li><a title="übergeordnet2" href="übergeordnet2.html" target="mainframe">&raquo; übergeordnet2</a></li>
<ul>
<li><a title="untergeordnet1" href="untergeordnet1.html" target="mainframe">&raquo; untergeordnet1</a></li>
<li><a title="untergeordnet2" href="untergeordnet2.html" target="mainframe">&raquo; untergeordnet2</a></li>
</ul>
<li><a title="übergeordnet3" href="übergeordnet3.html" target="mainframe">&raquo; übergeordnet3</a></li>
</ul>
[/HTML]

Das ganze sieht dann so aus:
http://img137.imageshack.us/img137/6784/probi.jpg

Uploaded with [Link nur für registrierte und freigeschaltete Mitglieder sichtbar. Jetzt registrieren...]

also hättet ihr da vlt ein paar Ideen wie man das so aufarbeiten kann dass man keinen Augenkrebs mehr davon bekommt?

Bis bald edipp

Doitsu 20.09.10 15:28

Breite vom 1. ul anpassen - margin-Werte ueberpruefen, padding raus nehmen ..
Ansonsten braeuchten wir noch CSS-Daten / ein Link zur Seite.

Sn00pX 24.09.10 20:33

du kannst mit css die li oder a tags direkt stylen entweder schreibst du dein css in die head area zwischen also z.b.

<style>
.menue > li {width:..px; list-style-type:none;} /*für definierte li´s*/
li {...........} /*für alle li´s*/
a {...........} /*für alle a tags*/
</style>

oder du stylst direkt was natürlich nicht so elegant ist

z.b.
<li style="width:..px; list-style-type:none;"><a title="Startseite" href="startseite.html" target="mainframe">» Startseite</a></li>

die feste width verhindert schonmal das deine untermenüpunkte sich verschieben/zu groß werden
list-style-type gibt an welche bullets verwendet werden... bei none logischerweise keine

so kannst du leicht die einzelnen li´s stylen
<style>
.menue > li {width:..px; list-style-type:none;} /*erste menüebene*/
.menue li ul > li {width:..px; list-style-type:none;} /*zweite menüebene*/
</style>
usw...

weis nicht genau was worauf du hinaus wolltest und wie das den aussehen sollte...
paar infos wären vl nicht so verkehrt.. :D

keine ahnung ob mein post jetzt überhaupt irgendwie sinnvoll war ... aber joa viel spaß:T

Doitsu 28.09.10 13:16

Zitat:

Zitat von Sn00pX (Beitrag 21307166)
<style>
.menue > li {width:..px; list-style-type:none;} /*erste menüebene*/
.menue li ul > li {width:..px; list-style-type:none;} /*zweite menüebene*/
</style>

1. fehlt da ein 'type="text/css"'
2. schau dir das mal im IE 6 an, der kennt diese '>' etc. nicht. Dazu ist diese genau Angabe ziemlich Sinnlos - '.menue li', '.menue ul li' wuerde reichen, auch wenn man die Daten dann ueberschreiben muss, wobei diese wohl zum groessten teil eh die gleichen sind. (Jedenfalls dem Screen nach zu folgen)

edipp 29.09.10 09:00

Ich liebe dieses Board!
also Sn00pX post war schon eine enorme hilfe, mit den anmerkungen von Doitsu hats dann letztendlich auch geklappt wie ich das wollte!

Thx leute

PS: ich merk mir für die zukunft direkt mehr infos mit meinem post zu geben
im nachhinein dann hier nochmal:
einerseits sollten die punkte weg (list-style-type:none; )
andererseits das einrücken so geregelt werden dass der abstand geregelt wird und hinten nichts übersteht (width & padding)


also bis dann edipp


Alle Zeitangaben in WEZ +1. Es ist jetzt 16:12 Uhr.

Powered by vBulletin® (Deutsch)
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.