TYPO3-Testaccount
Testen Sie die aktuellste TYPO3-Version kostenlos und unverbindlich für einen Monat!

Jetzt testen!

Schulungen

jetzt buchen
Forum » TypoScript » Menüs

Tmenu, css und falsche Formatübernahme


Autor Nachricht
Verfasst am: 15. 10. 2008 [09:54]
MB76
Themenersteller
Dabei seit: 24.09.2008
Beiträge: 34
 Ich möchte ein TMenu, mit verschiedenen Schriften für die Ebenen. Mein Problem: in der css-datei wird immer die Formatierung von Hyperlinks (a) verwendet. diese überschreibt dann meine menüklassen (z.B. mainnav1_font).
wie kann ich das ändern?
Kann man evtl. den Verweis nicht über den Text, sondern über das Hintergrundbild machen (wäre mir sowieso lieber)?

TYPOSCRIPT
Menu_Rechts = HMENU
Menu_Rechts.wrap = <div>|<div>
  Menu_Rechts.special = directory
  Menu_Rechts.special.value = 908
  Menu_Rechts {
  1 = TMENU
  1 {
    noBlur = 1
    expAll = 0
    wrap = <div>|<div>
    NO {
      allWrap = <div class="mainnav1_no"><div class="mainnav1_font"> |</div></div>
      stdWrap.case =
       } //
    ACT < .NO
    ACT = 1
    ACT{
      allWrap = <div class="mainnav1_act"><div class="mainnav1_font"> |</div></div>
    }
    RO < .NO
    RO = 1
    RO{
      allWrap = <div class="mainnav1_ro"><div class="mainnav1_font"> |</div></div>
    }
  }
  2 = TMENU
  2 {
    noBlur = 1
    expAll = 0
    wrap = <div>|<div>
    NO {
      allWrap = <div class="mainnav2_no"><div class="mainnav2_font"> |</div></div>
      stdWrap.case =
      } //
      ACT < .NO
    ACT = 1
    ACT{
      allWrap = <div class="mainnav2_act"><div class="mainnav2_font"> |</div></div>
    }
      RO < .NO
    RO = 1
    RO{
      allWrap = <div class="mainnav2_ro"><div class="mainnav2_font"> |</div></div>
  }
  }
  3 = TMENU
  3 {
    noBlur = 1
    expAll = 0
    wrap = <div>|<div>
    NO {
      allWrap = <div class="mainnav3_no"><div class="mainnav3_font"> |</div></div>
      stdWrap.case =
      } //
      ACT < .NO
    ACT = 1
    ACT{
      allWrap = <div class="mainnav3_act"><div class="mainnav3_font"> |</div></div>
    }
      RO < .NO
    RO = 1
    RO{
      allWrap = <div class="mainnav3_ro"><div class="mainnav3_font"> |</div></div>
  }
  }
}


meine CSS-Datei:
HTML
div.mainnav1_no{
 position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu1_no.gif);
  float: right;
}
div.mainnav1_act{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu1_act.gif);
  float: right;
}
div.mainnav1_ro{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu1_act.gif);
  float: right;
}
div.mainnav1_font{
  font-family : Verdana, Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 12px; 
  color: #ffffff; 
  text-decoration: none; 
  align: left;
  padding-left: 8px;
  padding-top: 8px;
}
div.mainnav2_no{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu2_no.gif);
  float: right;
}
div.mainnav2_act{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu2_act.gif);
  float: right;
}
div.mainnav2_ro{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu2_act.gif);
  float: right;
}
div.mainnav2_font{
  font-family : Verdana, Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 12px; 
  color: #000000; 
  padding-left: 8px;
  padding-top: 8px;
}
div.mainnav3_no{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu3_no.gif);
  float: right;
}
div.mainnav3_act{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu3_act.gif);
  float: right;
}
div.mainnav3_ro{
  position: relative;
  width: 210px;
  height: 30px;
  background-image:url(/fileadmin/version3/images/system/menu3_act.gif);
  float: right;
}
div.mainnav3_font{
  font-family : Verdana, Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 12px;
  color: #0000ff; 
  padding-left: 8px;
  padding-top: 8px;
}


im fertigen Seitenquelltext sieht ein Menüpunkt dann so aus:
HTML
<div><div class="mainnav1_no"><div class="mainnav1_font"><a href="912.0.html"  >Home</a></div>
Profil
Verfasst am: 15. 10. 2008 [11:23]
Dander
Dabei seit: 18.07.2003
Beiträge: 2287
 indem du im css auch den a-tag ansprichst
"div.mainnav2_font a" oder indem du dem a-tag eine
eigene klasse gibst
ATagParams = class="meine_klasse"

[Dieser Beitrag wurde 2mal bearbeitet, zuletzt am 15.10.2008 um 11:24.]
ProfilICQ
Verfasst am: 15. 10. 2008 [11:30]
MB76
Themenersteller
Dabei seit: 24.09.2008
Beiträge: 34
 kann ich den a-tag speziell für div.mainnav1_font festlegen? Ich hoffe, die Frage unterfordert niemanden icon_wink.gif
a soll global anders aussehen.

Danke
Profil
Verfasst am: 15. 10. 2008 [11:45]
Dander
Dabei seit: 18.07.2003
Beiträge: 2287
 ja, wie oben beschrieben
du kannst speziell diesen A-Tag so im css ansprechen

HTML
div.mainnav2_font a {
 
}


oder im css eine klasse anleden

HTML
a.deine_klasse {
 
}


und die in typoscript dann so ansprechen
TYPOSCRIPT
ATagParams = class="deine_klasse"


[Dieser Beitrag wurde 1mal bearbeitet, zuletzt am 15.10.2008 um 11:45.]
ProfilICQ
Verfasst am: 15. 10. 2008 [12:22]
MB76
Themenersteller
Dabei seit: 24.09.2008
Beiträge: 34
 SUPER. VIELEN DANK
Profil