Unterschiedliche CSS-Styles auf einer Seite

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Unterschiedliche CSS-Styles auf einer Seite

    Hi,
    bei vwar und auch bei anderen Scripten wird mein Menü, dass aus normalen Links besteht immer mit den (Link)Styles überschrieben, die in der CSS-Datei von vwar stehen. Sie sollen aber nach den Vorgaben in meiner normalen CSS-Datei formatiert werden, ich müsste also praktisch zwei unterschiedliche CSS-Dateien für je einen bestimmten Bereich auf der Seite einstellen können. Ist das möglich?
  • klar geht das solange sich die "class"-Namen nicht überschneiden, dh nicht ein und die selbe class zweimal deklarieren :).

    beispiel

    HTML-Quellcode

    1. <html>
    2. <head>
    3. <title>test</title>
    4. <link rel="STYLESHEET" type="text/css" href="style.css">
    5. <link rel="STYLESHEET" type="text/css" href="style_2.css">
    6. </head>
    7. <body>
    8. <p class="text>bla</p>
    9. <p class="nixda">blabla</p>
    10. </body>
    11. </html>
    Alles anzeigen


    so und nun hast du in style.css die class text deklariert und in style_2.css die class nixda, nur solltest du vermeiden auch noch in der style_2.css eine class text zu nennen.

    eigentlich simpel, oder?
    gruß jone
  • Irgendwie funktioniert das noch nicht.
    head:

    HTML-Quellcode

    1. <link href="style.css" rel="stylesheet" type="text/css">


    style.css:

    HTML-Quellcode

    1. <style type="text/css">
    2. .klo:link { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    3. .klo:visited { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    4. .klo:active { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    5. .klo:hover { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px;}
    6. </style>


    index.php:

    HTML-Quellcode

    1. <a href="index2.php?site=news"><font class="klo">News</font></a>
    2. Hier wird das böse Script includet, das alles überschreibt.


    Danke schonma :)
  • [01] das einfachste waere doch, wenn du einfach den vwar style-sheet editierst! oder hab' ich da was falsch verstanden!?

    [02] in einer *.css brauchst du nicht mehr explizit den typ feststellen!

    Quellcode

    1. .klo:link { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    2. .klo:visited { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    3. .klo:active { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    4. .klo:hover { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px;}


    ceeyaa.MeX
  • magelan schrieb:

    index.php:

    HTML-Quellcode

    1. <a href="index2.php?site=news"><font class="klo">News</font></a>
    2. Hier wird das böse Script includet, das alles überschreibt.


    das kann nicht funktionieren!
    es muss

    HTML-Quellcode

    1. <a href="index2.php?site=news" class="klo">News</a>

    heißen

    magelan schrieb:


    HTML-Quellcode

    1. <style type="text/css">
    2. .klo:link { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    3. .klo:visited { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    4. .klo:active { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    5. .klo:hover { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px;}
    6. </style>



    würde ich zu

    HTML-Quellcode

    1. a.klo:link { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    2. a.klo:visited { color:#648DBB; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    3. a.klo:active { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px; }
    4. a.klo:hover { color:#996666; font-family:Arial; text-decoration:none; font-style:none; font-size:12px;}


    machen, wei diese attribute eh nur auf links anwendbar sind und ich nicht weiß, inwieweit das sonst von browsern unterstützt wird (hover & co werden z.b. bei div.hover ignoriert --> vleicht auch bei .hover ohne "a" davor)

    und das <style> und </style> natürlich weglassen ;)

    cya dn87p
  • Mit der vollen Kompetenzbreite unsere Community werden Sie hier geholfen, ein Vorbildlicher Thread (mal mein erster Post ausgenommen, aber ich wußt ja nicht wo das Prob war :D), das macht Lust auf mehr.

    GESCHLOSSEN.