Ergebnis 1 bis 7 von 7

Thema: Hintergrundfarbe von nur einem Listeneintrag entfernen

  1. #1
    Teeny
    Registriert seit
    20.06.2010
    Beiträge
    43
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Hintergrundfarbe von nur einem Listeneintrag entfernen

    Hallo,

    ich habe eine Liste welche in einer einer global definierten Box liegt. Jetzt möchte ich das ein Listenpunkt dieser Liste, anders als alle anderen NICHT mit einer Hintergrundfarbe versehen ist. Versucht habe ich diesen Eintrag mit einer Klasse zu definieren, allerdings hatte dies keine Auswirkung. Egal ob ich eine andere Hintergrundfarbe definiere oder diese mittels 'transparent' auszublenden versuche.

    Hat jemand eine Idee was ich tun könnte?

    Folgend der HTML Code
    Code:
    <div id="content_list" >                                                                        
                                    <ul>
                                        <li><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li><!-- um die Hintergrundfarbe dieses Listenpunktes geht es mir -->
                                    </ul>
                                    <ul>
                                        <div class="content_wrapper">
                                            <li><a href="zin_amphi_2010.html">ZIN (Gewinner New Talents)</a></li>
                                            <li><a href="din_a_tod_amphi_2010.html">DIN [A] TOD</a></li>
                                            <li><a href="endofgreen_amphi_2010.html">End of Green</a></li>
                                            <li><a href="ashb_heights_amphi_2010.html">Ashbury Heights</a></li>
                                            <li><a href="welle_erdball_amphi_2010.html">Welle:Erdball</a></li>
                                            <li><a href="blutengel_amphi_2010.html">Blutengel</a></li>
                                            <li><a href="anne_clark_amphi_2010.html">Anne Clark</a></li>
                                            <li><a href="and_one_amphi_2010.html">And One</a></li>
                                            <li><a href="impressionen01_amphi_2010.html">- Impressionen -</a></li>
                                        </div>
                                    </ul>
    </div>
    Im Detail geht um die erste unsortierte Liste, bzw. um den Listeneintrag.

    Und hier der CSS Code
    Code:
    #content_list ul {
        margin-bottom: 1.8em;    
    }
    
    .content_wrapper {
        -moz-box-shadow: 5px 5px 5px #a0a0a0; 
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 5px 5px 5px #a0a0a0;
        border-radius: 5px;         
    }
    
    #content_list li h4 {
        margin: -1% -4% 5% 5%; /*top right bottom left*/
        -moz-box-shadow: 5px 5px 5px #494949; 
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        box-shadow: 5px 5px 5px #494949;
        border-radius: 5px;  
        line-height: 2em;
        border: 1px solid white;
        background: #999;
        font-size: 1.3em;    
        min-height: 2em;
        min-width: 50%;
        color: white;
        float: right;
    }
        
    #content_list ul li {
        background: #666;    
    }
    Mir ist klar das ich mit dem untersten Eintrag des CSS Codes die Hintergrundfarbe Global für alle in der Box aufgeführten Listeneinträge setze, daher suche ich eine Art gebräuchlich Ausnahme Regelung...

    MfG
    mephisto2k
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard AW: Hintergrundfarbe von nur einem Listeneintrag entfernen

    Zitat Zitat von mephisto2k Beitrag anzeigen
    Versucht habe ich diesen Eintrag mit einer Klasse zu definieren, allerdings hatte dies keine Auswirkung.
    Das ist die gebräuchliche Methode. Die funktioniert, wenn sie richtig gemacht wird.
    Wie hast du es denn versucht?
    Something big is coming. And there will be pirates and ninjas and unicorns...

  3. #3
    Teeny
    Themenstarter

    Registriert seit
    20.06.2010
    Beiträge
    43
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hintergrundfarbe von nur einem Listeneintrag entfernen

    Mein kläglicher Versuch sieht wie folgt aus

    HTML
    Code:
    <ul>
        <li class="no_bg"><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li>
    </ul>
    CSS
    Code:
    .no_bg {
        background-color: transparent;
    }
    Den CSS Code habe im Anschluss es im ersten Beitrags geposteten Codes eingetragen und ist somit die letzte Bedingung in dieser CSS Sparte.

  4. #4
    Jedi Ritter Avatar von Dodo
    Registriert seit
    26.04.2008
    Ort
    Wien
    Alter
    27
    Beiträge
    3.774
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings
    Blog-Einträge
    1

    Standard AW: Hintergrundfarbe von nur einem Listeneintrag entfernen

    Zitat Zitat von mephisto2k Beitrag anzeigen
    Mein kläglicher Versuch sieht wie folgt aus

    HTML
    Code:
    <ul>
        <li class="no_bg"><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li>
    </ul>
    CSS
    Code:
    .no_bg {
        background-color: transparent;
    }
    Den CSS Code habe im Anschluss es im ersten Beitrags geposteten Codes eingetragen und ist somit die letzte Bedingung in dieser CSS Sparte.
    Versuchs mal damit
    Code:
    #content_list li.no_bg h4 {
        background-color: transparent;
    }
    Something big is coming. And there will be pirates and ninjas and unicorns...

  5. #5
    König(in)
    Registriert seit
    07.02.2009
    Ort
    Leipzig
    Beiträge
    1.391
    Danke
    2
    Bekam 21 mal "Danke" in 20 Postings

    Standard AW: Hintergrundfarbe von nur einem Listeneintrag entfernen

    Du setzt
    a) die Hintergrundfarbe in Zusammenhang mit einer ID, also per

    Code:
    #content_list li h4 {
    definiert (das hat vor einer puren Klassen-Definition vorrang), und

    b) die Hintergrundfarbe an das h4 gehangen, nicht an das <li>.

    Wenn Du also deiner Klassen-Definition vorrang gewähren willst, dann sag entweder, dass diese innerhalb der selben ID liegt, also

    Code:
    #content_list li.no_bg h4 { background-color: transparent; }
    oder mache diese Angabe "wichtig" und häng sie aber an das <h4>:

    Code:
    .no_bg h4 {
        background-color: transparent !important;
    }

  6. #6
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hintergrundfarbe von nur einem Listeneintrag entfernen

    Beachte ferner:

    ul darf nur li enthalten.
    Bisher:
    Code:
     <ul>
                                        <div class="content_wrapper">
                                            <li><a href="zin_amphi_2010.html">ZIN (Gewinner New Talents)</a></li>
    Deshalb besser:

    Code:
     <ul class="content_wrapper">
                                     <li><a href="zin_amphi_2010.html">ZIN (Gewinner New Talents)</a></li>

  7. #7
    Teeny
    Themenstarter

    Registriert seit
    20.06.2010
    Beiträge
    43
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Hintergrundfarbe von nur einem Listeneintrag entfernen

    Vielen vielen Dank ^^

    ich habe den HTML Quellcode jetzt wie folgt geändert
    Code:
    <div id="content_list" >                                                                        
        <ul>
            <li class="no_bg"><h4>Tag 1 - Samstag, 24 Juli 2010</h4></li>
        </ul>
        <ul class="content_wrapper">
                <li><a href="zin_amphi_2010.html">ZIN (Gewinner New Talents)</a></li>
                <li><a href="din_a_tod_amphi_2010.html">DIN [A] TOD</a></li>
                <li><a href="endofgreen_amphi_2010.html">End of Green</a></li>
                <li><a href="ashb_heights_amphi_2010.html">Ashbury Heights</a></li>
                <li><a href="welle_erdball_amphi_2010.html">Welle:Erdball</a></li>
                <li><a href="blutengel_amphi_2010.html">Blutengel</a></li>
                <li><a href="anne_clark_amphi_2010.html">Anne Clark</a></li>
                <li><a href="and_one_amphi_2010.html">And One</a></li>
                <li><a href="impressionen01_amphi_2010.html">- Impressionen -</a></li>
        </ul>
    </div>
    Und die CSS Zeile sieht wie folgt aus
    Code:
    #content_list li.no_bg {
        background-color: transparent;
    }
    Die 'h4' ergänzung habe ich entfernt da ich nicht den Hintergrund der Überschrift wegnehmen wollte sondern den der des Listeneintrages, bzw. den Hintergrund der Listenzeile selbst.

    Jetzt ist auch alles XHTML 1.0 Strict valide --> siehe hier

    Also nochmal vielen Dank!

    MfG
    mephisto2k

Ähnliche Themen

  1. Zylinder entfernen, wenn sich Schraube nicht entfernen lässt
    Von Unregistriert im Forum Off Topic und Quasselbox
    Antworten: 0
    Letzter Beitrag: 20.07.2009, 15:17
  2. teilnehmer zu einem event hinzufügen/entfernen
    Von synaptic im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 0
    Letzter Beitrag: 12.07.2009, 12:11
  3. hintergrundfarbe+bild
    Von im Forum HTML & CSS Forum
    Antworten: 14
    Letzter Beitrag: 19.10.2006, 08:51
  4. Hintergrundfarbe
    Von im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 28.08.2005, 15:02
  5. mit einem link ein frame entfernen
    Von luck im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 16.03.2005, 15:46

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •