Kleines CSS Problem

Dieses Thema im Forum "Webentwicklung" wurde erstellt von el_Nacho, 25. August 2005 .

Schlagworte:
  1. 25. August 2005
    (kleines) css-problem

    Tach,

    kenn mich mit css kaum aus und kriegs echt nich hin.
    meine seite verwendet stylesheets:

    <style type="text/css">
    <!--
    ...
    -->
    </style></head>

    das funktioniert wunderbar nur sollen die links in einem bestimmten bereich nen eigenen style haben. warum geht sowas hier:

    <p style="a:link { color : #ffffff }">Text</p>

    <p><a href="...">...</a></p>

    ... nich bzw. wie kann ich das machen?




    schonmal danke
     
  2. 25. August 2005
    mach doch für jeden bereich ne iegenene id
    zb
    <style type="text/css">
    .id1{
    color:#000000;
    }
    </style>

    oder

    <style type="text/css">
    #id1{
    color:#FFFFFF;
    }
    </style>
    musst ausprobieren was richtig ist entweder . oder #
    damit das aber klappt musst du statt
    <p style="a:link { color : #ffffff }">Text</p>
    ;
    <p id="id1"></p>
    machen
     
  3. 26. August 2005
    das hab ich schon versucht und das klappt mit text etc. aber wenn ich da drinne angebe wie die links aussehen sollen also z. B. :


    a:link
    {
    color : #ffffff;
    }


    gehts nich :/
     
  4. 26. August 2005
    probier es mal mit
    <style type="text/css">
    <!--
    a:link {
    color: #CCCCCC;
    text-decoration: none;
    }
    a:visited {
    text-decoration: none;
    color: #CCCCCC;
    }
    a:hover {
    text-decoration: none;
    color: #CCCCCC;
    }
    a:active {
    text-decoration: none;
    color: #CCCCCC;
    }
    -->
    </style>
     
  5. 26. August 2005
    du hast mich falsch verstanden. das hab ich gemacht, nur sollen sich alle links in nem bestimmten bereich anders verhalten.

    ich poste mal nen falschen code

    //---------------------------------------------------------
    <style type="text/css">
    <!--
    a:link {
    color: #CCCCCC;
    text-decoration: none;
    }
    a:visited {
    text-decoration: none;
    color: #CCCCCC;
    }
    a:hover {
    text-decoration: none;
    color: #CCCCCC;
    }
    a:active {
    text-decoration: none;
    color: #CCCCCC;
    }



    .id
    {
    a:link
    {
    color: #000000;
    text-decoration: underlined;
    }

    }
    -->
    </style>

    //---------------------------------------------------------

    und nun sollten sich doch die links inner halb des tags <p id="id1"> ... </p>
    anders verhalten ... sie tuns aber nich (

    ich glaube es liegt daran dass man das nich so verschachteln kann aber ne andere möglichkeit find ich nich ...
     
  6. 26. August 2005
    ja aber ... ich will doch eigentlich garnich so viel ... alle links sollen die eine farbe haben nur die im menü nich ... wie mach ich das dann? ?(
     
  7. 27. August 2005
    so nun hab ich das doch irgendwie hinbekommen
    wens interessiert, so wirds gemacht:


    es zu verschachteln geht nich, möchte man also z. B. für id1 ...

    .id1
    {
    ...
    }

    ... die links, hover, ... ändern macht man einfach folgendes:

    .id1 a
    {
    text-decoration: none;
    color: #ffffff;
    }

    .id a:hover
    {
    text-decoration: underlined;
    color: #ffffff;
    }




    sooo damit habe ich mir selber geholfen, darf ich mir dann auch selbst nen 10er geben? ;D
     
  8. 28. Juni 2006
    Kleines CSS Problem...

    Aloha!

    Hab da ein kleines Problem, sitze zurzeit an na etwas größeren seite, und nun möchte ich das es 2 verschiede arten von rollover effekten bei text-links gibt. Ich bin kein mega css profi und daher weiss ich da nicht weiter.

    Also, hab ne css datei, wo einmal der standartmäßige link ist der wie folgt bei css ist:

    Code:
    A:link { text-decoration:underline; color: #0158ba; }
    A:visited { text-decoration:underline; color: #0158ba; }
    A:hover { text-decoration:none; color: #253e5a; }
    
    Nun soll für bestimmte bereiche wo genau die farbe "#253e5a" der hintergrund ist, folgendes passieren:

    Code:
    A:link { text-decoration:underline; color: #fff847; }
    A:visited { text-decoration:underline; color: #fff847; }
    A:hover { text-decoration:none; color: #fff847; }
    
    ich hab schon versucht eine extra part zu machen der wie folgt aussieht:

    Code:
    a.link_admin:link, a.link_admin:visited {
     font-family:Arial;
     color:fff847;
     FONT-SIZE: 11px;
     text-decoration: underline;
    }
    a.link_admin:hover {
     font-family:Arial;
     color:fff847;
     FONT-SIZE: 11px;
     text-decoration: none;
    }
    
    und das dann auch beim link durch "class="link_admin"" aufzurufen. Doch, es klappt nicht...

    Was mache ich also Falsch? Wäre nett wenn mir da jemand helfen könnte...

    Gruß,
    LL
     
  9. 28. Juni 2006
    Warum machst nicht für die Links die nicht link_admin sind auch ne eigene Klasse? Kann sein das die allgemeinen Einstellungen die spezifischen der Klasse "überschreiben".
     
  10. 28. Juni 2006
    Die Überlegung hatte ich auch schon, nur wäre es ziemlich umständlich bei jedem link die class anzugeben, die "link_admin" dinger sind halt nur ein paar mal ... im gegensatz zu denn "normalen" links, die eigentlich überall sind ....

    Gruß,
    LL
     
  11. 28. Juni 2006
    Das einzige was mir sonst noch aufgefallen wäre:
    Code:
    a.link_admin:link, a.link_admin:visited {
    font-family:Arial;
    color:fff847;
    FONT-SIZE: 11px;
    text-decoration: underline;
    }
    a.link_admin:hover {
    font-family:Arial;
    color:fff847;
    FONT-SIZE: 11px;
    text-decoration: none;
    }
    Warum machst du vor die Farben keine Raute?
     
  12. 28. Juni 2006
    Also die raute ist relativ egal, kann da stehen...muss aber nicht...

    Gruß,
    LL
     
  13. 29. Juni 2006
    Ich habe auch schon verschiedene Eigenschaften für Links gemacht mit css. Bei mir sieht das ganze so aus und funktioniert. Glaube du hast die Syntax bissl verdreht. Probiers mal damit. Als class natürlich "admin".

    Code:
    a:link.admin {
     font-family: Arial;
     color: #FFF847;
     font-size: 11px;
     text-decoration: underline;
    }
    a:visited.admin {
     font-family: Arial;
     color: #FFF847;
     font-size: 11px;
     text-decoration: underline;
    }
    a:hover.admin {
     font-family: Arial;
     color: #FFF847;
     font-size: 11px;
     text-decoration: none;
    }
    mfg
    m00pd00p
     
  14. 29. Juni 2006
    Traumhaft, es klappt! :] Dankeschön, hab dir mal en 10er gegeben!

    Gruß,
    LL
     
  15. 6. November 2008
    Ich müsste fix ein template fertig kriegen, und mir fehlt nur eine Kleinigkeit.
    Vielleicht kann mir jemand helfen.

    eine div box brauch ich, wo von links nach rechts ein balken geht, so wie hier oben im forum die menüunterlegung ist.

    wäre jemand so gnädig, mir da kurz zu helfen?

    nehmen wir ein 3x50px menu.png als unterlegung sozusagen.
     
  16. 10. Dezember 2008
    kleines css problem...

    Könnte mir jemand helfen?
    bin ein kleiner css noob, bzw. hab ewig nix mehr gemacht....

    irgendwie ist das alles verschoben.
    header kommt oben und headerglas wird drübergelegt, das ist korrekt.

    aaaber, id="mitte" soll anschliessen und id="content" umschliessen, bzw. davon hinterlegt sein!!!!!!!!!!!!!!

    drunter kommt dann halt contentunten als abschluß, gefolgt vom footer.
    ist siche rnur ein denkfehler drin, aber wäre nett, wenn mir da jemand helfen könnte.


    hier die index.html

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    
     <head>
     <meta http-equiv="content-type" content="text/html;charset=utf-8" />
     <title>Webseite</title>
     <link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
     </head>
    
     <body>
     <div id="header"> 
     <div id="headerglas">
     </div>
     </div>
     <div = id="mitte">
     <div id="content">
     </div>
     </div>
     <div id="unten">
     </div>
     <div id="footer">
     </div>
     
     </body>
    
    </html>
    und hier die style.css

    Code:
    body {
     text-align:center;
     padding-top: 0px;
     background-color: #202020;
     color: #FFF;
     font-family: verdana, arial, sans-serif;
     
     text-align: left;
     letter-spacing: 1px;
    }
    
    #header {
     background-image: url(../images/oben.png);
     width:705px;
     height:471px;
     position:relative;
     margin:0px auto; 
    }
    
    #headerglas {
     background-image: url(../images/header.png);
     width:711px;
     height:186px;
     position:relative;
     top: 110px;
     margin:0px auto;
    }
    
    #mitte {
     background-image: url(../images/contentmitte.png);
     width:705px;
     height:49px;
     position:static;
     background-repeat:repeat-x;
     margin:0px auto;
    }
    
    #unten {
     background-image: url(../images/contentunten.png);
     width:705px;
     height:128px;
     position:relative;
     margin:0px auto;
    }
    
    #footer {
     background-image: url(../images/footer.png);
     width:739px;
     height:67px;
     position:relative;
     margin:0px auto;
    }
    
    #content {
     background-image: url(../images/content.png);
     width:400px;
     height:200px;
     position:relative;
     margin:0px auto;
     overflow:hidden;
    }
    
     
  17. 10. Dezember 2008
    AW: kleines css problem...

    Hi,

    Das ganze schaut doch schonmal recht gut aus, mach mal bei <div = id="mitte"> das eine = weg, dann sollte es gehen, zumindest bei mir gehts dann.

    Grüße,
     
  18. 10. Dezember 2008
    AW: kleines css problem...

    aber wenn ich jetzt einen größeren content nehme also 400x300 dann wird dieser zusätzlich unter dem footer angezeigt, wieso das?
     
  19. 10. Dezember 2008
    AW: kleines css problem...

    *g* kein problem! kenn das nur zu gut, man sucht und sucht und findet den fehler nicht, dabei ist manchmal nur ein "komma" falsch oder sowas in der art, weiterhin viel spaß beim coden!
     
  20. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.