zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden CSS Menü

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 20.03.2010, 19:25
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.03.2010
Ort: Bochum
Beiträge: 6
MadBall befindet sich auf einem aufstrebenden Ast
Standard CSS Menü

Hallo,

Seit etwa 2 Jahren erstelle ich Webseiten in HTML, ich habe nun auch angefangen CSS zu verwenden, und komme auch recht gut damit klar.
Leider habe ich noch Probleme was Variablen angeht, ich habe da zwei Probleme für die ich selber keine Lösung finde.
Ich würde mich sehr freuen wenn mir hier jemand weiterhelfen kann.

Ich verwende ein Menü das mit eingebetteten CSS läuft, die Codes habe ich nun in einer CSS Datei ausgelagert, dadurch brauche ich bei Änderungen nicht mehr die vielen Menüs einzeln anpassen,auch bei den Styls für Texte verwende ich CSS.
In Firefox bringen meine Codes für das Textstyl das was ich beabsichtige, aber in IE sind sie wirkungslos

Hier nun die Codes die ich verwende.
Code:
------ Im der HTML Datei. ------

<table style=" margin: 8px 0 0 295px 
" cellSpacing="0" cellPadding="0" width="15%" border="0">
<tr>
<td id="layer2" vAlign="top" <t1-2c>Hier steht ein Textblock</td></tr></t1-2c></table>

------ In der CSS Datei ------

t1-2a, t1-2b, t1-2c {
      font-family: Tahoma, Verdana, sans-serif;
}

t1-2a {
   margin-left: 0pt; 
   color: #ff6a29;
   line-height: 20pt;
   font-weight:bold;
   font-family:Verdana;
   font-size: 12pt;
   letter-spacing: 0.2em;
   word-spacing: 3px;
}

t1-2b {
   margin-left: 0pt; 
   color: #f27d00;
   line-height: 20pt;
   font-weight:bold;
   font-family:Verdana;
   font-size: 12pt;
   letter-spacing: 0.2em;
   word-spacing: 3px;
}


t1-2c {
   margin-left: 0pt; 
   color: #ffd75d;
   line-height: 20pt;
   font-weight:bold;
   font-family:Verdana;
   font-style:italic;
   font-size: 12pt;
   letter-spacing: 0.2em;
   word-spacing: 3px;
}
Durch t1-2a wird den Text der Styl angegeben was im Firefox auch geht.
Bestimmt wundert man sich etwas über das t1-2a, aber es macht für mich Sinn weil ich durch diese Bezeichnungen weiß wo dieser Wert sein Einsatz hat.
( t1-2a bedeutet -- t1 für die erste Menüebene und 2 für die zweite Textseite und a für den ersten Textblock, also t1-2a )
Bestimmt lacht man sich nun über meine Art etwas zu benennen kaputt

Nun zu meinen zweiten Problem, es geht dabei um das Menü das ich verwende.

HTML-Code:
------ In der CSS Datei ------

]#menu1A {
width:160px;
margin: 0px;
padding:0px;

}

#menu1A ul, #menu1A li {
 list-style-type: none;
margin-left:0px;
padding: 0px;


}


#menu1A li a:link, #menu1A li a:visited, #menu2A li a:active {display:block;
                 background:  url("Menue2A.png") no-repeat;
                 border-top: solid 0px #9dcdff;
                 border-left: solid 0px #9dcdff;
                 border-bottom: solid 0px #de9dff;
                 border-right: solid 0px #de9dff;
                 background-position: 20% 20%;


                 color:#90d5ee;text-decoration:none;
                 font: bold 14px arial;
                 height:20px;
                 line-height: 23px;
                 padding-left:10px;
                 margin-bottom: 10px;
                 margin-top: 0px;

}

#menu1A li a:hover { background:  url("Menue2B.png") no-repeat;
                font: bold 16px arial;color:#2eb5fa;
                height:20px;
                line-height: 23px;
                padding-left:10px;
                margin-bottom: 10px;
                margin-top: 0px;
                text-decoration:none;background-position: 20% 20%;

}

------ Im der HTML Datei. ------


<table>
<tr>
<td><!--MENU 001-->
<div id="menu1A">
<ul>
<li></li>

<lj><a href="Startseite.htm"  onfocus="target="_top"this.blur()">Startseite</a></lj>

<li><a href="UeberMich.htm"   onfocus="target="_top"this.blur()">Über mich</a></li>
<li><a href="DasBinIch.htm"   onfocus="target="_top"this.blur()">Das bin ich</a></li>
<li><a href="Geschichten.htm" onfocus="target="_top"this.blur()">Geschichten</a></li>
<li><a href="Gedichte.htm"    onfocus="target="_top"this.blur()">Gedichte</a></li>
<li><a href="Freunde-.htm"    onfocus="target="_top"this.blur()">Freunde</a></li>
<li><a href="ZuViel.htm"      onfocus="target="_top"this.blur()">Zu Viel</a></li>
<li><a href="Chat.htm"        onfocus="target="_top"this.blur()">Chat</a></li>
<li><a href="Forum.htm"       onfocus="target="_top"this.blur()">Forum</a></li>
<li><a href="Gaestebuch.htm"  onfocus="target="_top"this.blur()">Gästebuch</a></li>
<li><a href="Kontakt.htm"     onfocus="target="_top"this.blur()">Kontakt</a></li>
<li><a href="Impressum.htm"   onfocus="target="_top"this.blur()">Impressum</a></li>


</ul>
</div>
<!--MENU 001 ENDE--></td>
<td>
&nbsp;
</td>
Da ich im Menü die Schrift farbig gestalten möchte habe ich den CSS Code mehrfach für eine Menüebene verwendet dadurch erreiche ich das ich mehrere Farben für das Manü benutzen kann, es besteht aus 4 - 6 Farben.
Hier nun die Seite auf der ihr euch das mal ansehen könnt SchwarzeMaus ,das Startmenü läuft in Firefox und in IE nur im IE werden Farbe 3 und 4 nicht angezeigt, und in den Untermenüs geht gar nichts mehr, und auch im Firefox macht es Probleme.
Die Bezeichnung <li> habe ich in anderen Menübereichen und für jede Farben geändert z.B lj lk ll lm ln usw.

Ich hoffe nun das ich für meine Probleme eine Lösung bekommen kann, vielen dank fürs lesen, und für Antworten.

LG MadBall
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 21.03.2010, 02:35
Neuer Benutzer
neuer user
 
Registriert seit: 19.03.2010
Beiträge: 12
Projecta befindet sich auf einem aufstrebenden Ast
Standard

Man kann nicht einfach aus dem Listenaufzählung <li> ein <lj> oder sonstwas machen.

Wenn du den einzelnen Listenpunkten Klassen zuweisen möchtest, dann geht das zb so:

HTML:
Code:
<li class="li_1"><a href="UeberMich.htm"   onfocus="target="_top"this.blur()">Über mich</a></li>
<li class="li_2"><a href="DasBinIch.htm"   onfocus="target="_top"this.blur()">Das bin ich</a></li>
Dann kannst du über diese Klassen das Element li oder in deinem Falle hier a via CSS folgendermaßen ansprechen:

CSS:
Code:
.li_1 a
{
color: #999;
}

.li_2 a
{
color: #f00;
}

.li_1 a:hover, .li_2 a:hover
{
color: #fff;
}
Grundlegende Informationen über CSS findest du zB hier:

CSS 4 You - The Finest in Stylesheets
Homepagetipps und Tricks - www.Netzwelt-kali.de

Auch solltest du Rücksicht auf die User nehmen und Spielereien, die nicht unbedingt nötig sind, soweit wie möglich reduzieren, selbst wenn du solche Sachen wie Mauszeigersternchen und Co anfangs ganz nett findest. Im Grunde kostet das alles Rechnerleistung und nicht jeder User hat JavaScript aktiviert.

Eben auch deshalb designt man heute Seiten via CSS und nicht mehr über JS (onfocus & Co gehören ebenfalls raus, das geht mittlerweile alles per CSS).

Keep it simple and stupid - dann wirds auch gut...
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 21.03.2010, 03:02
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 20.03.2010
Ort: Bochum
Beiträge: 6
MadBall befindet sich auf einem aufstrebenden Ast
Standard

Hallo ,

Danke für deine schnelle Antwort zu so später Stunde.

Die Menücodes habe ich auch aus dem Internet, habe sie aber nach meinen Wünschen angepasst, Css verwende ich erst seit 3 Tagen und ich habe auch schon einiges gelernt, aber es gibt eben vieles was man wissen muss und nicht immer findet man einen Weg durch ausprobieren obwohl ich bis jetzt immer einen Weg finden konnte auch wenn der nicht immer der modernste ist, fuktionieren muss es was mir am wichtigsten ist.

Natürlich möchte ich auch mit meinen codes auf dem laufenden sein und darum freue ich mich immer sehr wenn es jemanden gibt der mich aufklärt so wie du.

Das onfocus veraltet ist wusste ich nicht, naja es funktioniert eben und erfüllt erst mal seinen Zweck.
Mir ist allerdings noch nicht ganz klar warum man auf andere Codes zugreifen sollte, ich kann mir allerdings vorstellen das die neueren Codes einen mehr Möglichkeiten bieten.

Wie ich schon sagte verwende ich CSS erst seit drei Tagen , und habe schon jetzt sehr viele Vorteile entdeckt, und auch viele Möglichkeiten kennengelernt.
Naja mit CSS stehe ich noch sehr am Anfang, ich denke mit der Zeit und mit viel lesen in diesen Forum werde ich bald auch einiges mehr drauf haben, und auch in HTML dürfte es bei mir etwas mehr Wissen sein, und naja mit PHP fummel ich auch gerade etwas rum und nicht mal erfolglos.

Bei dem Problem mit dem Styl für Texte bin ich übrigens sogar von selber darauf gekommen das man mit " Class= " zu versuchen, naja ich fummel mich so dadurch was auch nicht falsch ist.

LG MadBall
Mit Zitat antworten
  #4 (permalink)  
Alt 21.03.2010, 04:04
Neuer Benutzer
neuer user
 
Registriert seit: 19.03.2010
Beiträge: 12
Projecta befindet sich auf einem aufstrebenden Ast
Standard

Jup, Trial and Error: thats how nature functions...

onFocus hat schon noch seine Berechtigung, aber man sollte JS halt so gut wie möglich vermeiden.
In punkto WEB 2.0 gehört JS eben genauso wie CSS richtig eingesetzt.

Und da kommt man, will man sich Zeit und Nerven sparen, um Grundkenntnisse nicht drum rum.

Projekte sind auch immer Kunden- bzw. User-spezifisch. Das kannst eh nur du wissen, was du benötigst bzw. für welche User oder Freunde du was wie machst.

Lesestoff gibts genug im Netz, und Probieren und Solieren macht ja auch Spass...

Noch viel Vergnügen und gutes Gelingen
Projecta
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit CSS Dropline menü horst77 CSS 1 12.08.2009 12:49
herunterfahrendes Menü mit CSS Pablo CSS 1 27.12.2007 18:07
CSS Menü - Buttonfrage Ralgar CSS 6 01.12.2006 18:14
Mysteriöses in CSS Dropdown Menü ph!L CSS 3 21.07.2006 13:31
Menü mit CSS aber mit JS Animation? xy2er CSS 6 20.03.2005 21:47


Alle Zeitangaben in WEZ +2. Es ist jetzt 07:40 Uhr.