Ankündigung

Einklappen
Keine Ankündigung bisher.

Tabellenzelle als Link

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Gast-Avatar
    Ein Gast erstellte das Thema Tabellenzelle als Link.

    Tabellenzelle als Link

    Kann man eine ganze Tabellenzelle <td> zu einem Link machen? Mit anderem Hintergrund bei Hover z.B. ?

  • Gast-Avatar
    Ein Gast antwortete
    Ich raffs nicht, ich glaube ich stehe auf dem Schlauch. Wäre es zu viel verlangt, zu fragen, ob mir das mal jemand machen könnte? Stehe ein wenig unter Zeitdruck und krieg das einfach nicht gebacken.

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Schau dir doch mal folgende Tutorials genauer an, da steht ziemlich viel bezüglich CSS Layouten und so schwer ist das gar nicht :

    http://css4you.de/wslayout1/index.html
    http://de.selfhtml.org/css/layouts/index.htm

    Ich bin mir sicher wenn du das verstanden hast, löst du dieses Design oben innert 10 Minuten.

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Ich hab inzwischen keine Ahnung mehr, wie es gehen soll. D.h. außer dem Code, den ich bisher hatte (und gepostet habe) habe ich nichts mehr.

    Einen Kommentar schreiben:


  • xabbuh
    antwortet
    Ohne Quellcode?

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Kann mir niemand helfen?

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Danke hierfür. Aber mein inzwischen größeres Problem ist, dass ich die Streifen an den Seiten und das Bild oben nicht richtig positioniert bekomme.

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Lass doch Tabellen Tabellen sein und machs "richtig".

    Hier als kleiner Denkanstoss: http://d4rk.com/jstest/hover.html

    Einen Kommentar schreiben:


  • xabbuh
    antwortet
    Wie sieht denn dein Quellcode aus?

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Hmm Es gelingt mir ums Verderben nicht, das zu coden, was ich will ...

    Es geht darum, dass die Seite so aussehen soll, wie auf diesem Bild:



    Die 4 Links oben sollen den Hover-Effekt bekommen. Kann mir jemand weitere Tipps geben?

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Danke, werd mir das mal noch anschauen.

    Einen Kommentar schreiben:


  • DiBo33
    antwortet
    Wie wäre es, von der Tabelle ganz Abstand zu nehmen?


    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
     <title>Projekt</title>
    <style type="text/css">
    * {
      padding:0px;
      margin:0px;
      }
      
    html, body {
      height: 100%;
      }
    
    body {
      background-color: rgb(224, 224, 224);
      font:12px arial, tahoma, verdana, sans-serif;
      text-align: justify;
      background-image(mj05_bg.png);
      }
    
    #menu {
      margin: 155px 0 0 44px;
      list-style-type: none;
      width: 555px;
      height: 24px;
      }
      
    #menu li {
      float: left;
      line-height: 24px;
      }
      
    #menu li a {
      color: rgb(0, 0, 0);
      text-decoration: none;
      text-align: center;
      display: block;
      width: 100%;
      }
     
    #menu li a:hover {
      background-color: rgb(138, 124, 114);
      }
     </style>
    </head>
    <body>
      <ul id="menu">
        <li style="width:74px;">home
        <li style="width:200px;">Biographie
        <li style="width:200px;">Nummer
        <li style="width:77px;">Kontakt[/list]
      <p style="clear:both;">
         hhllo
      </p>
    </body>
    </html>

    Einen Kommentar schreiben:


  • DER_Brain
    antwortet
    cellspacing:0;
    cellpadding:0;

    ich glaub die befehle müsstes einbauen..

    mfg
    Andi

    Einen Kommentar schreiben:


  • DiBo33
    antwortet
    Wozu überhaupt eine Tabelle?
    Eine Liste tuts auch.

    Fehlender Doctype, deshalb schaltet der IE in den Quircksmode.

    Ansonsten geht das schon eleganter, da habe ich aber jetzt leider keine Zeit zu.

    Einen Kommentar schreiben:


  • Gast-Avatar
    Ein Gast antwortete
    Da es noch nicht sehr viel Code ist, schreib ich ihn mal hier rein ... Ich raff es leider net so ganz, steh grad auf dem Schlauch.

    index.php (bisher nur html)

    Code:
    <html>
    <head>
     <title>Projekt</title>
     <link rel="stylesheet" type="text/css" href="mj05_style.css">
    </head>
    <body>
    <table align="center" valign="top" width="600" height="100%" background="mj05_bg.png" cellspacing="0" cellpadding="0">
     <tr>
      <td width="600" height="155"colspan="6">
      </td>
     </tr>
     <tr>
      <td class="mj05_menu" width="44">
       [img]mj05_placeholder.gif[/img]
      </td>
      <td class="mj05_menu" width="74">
       home
      </td>
      <td class="mj05_menu" width="200">
       Biographie
      </td>    
      <td class="mj05_menu" width="200">
       Nummer
      </td>
      <td class="mj05_menu" width="77">
       Kontakt
      </td>
      <td class="mj05_menu" width="5">
      </td> 
     </tr>
     <tr>
      <td width="600" colspan="6">
      </td>
     </tr>
    </table> 
    
     hhllo
    </body>
    CSS
    Code:
    /* CSS für Projekt */
    
    /* Wichtige Farben
    
    */
    
    body {
     background-color: rgb(224, 224, 224);
     margin: 0px;
     font-family: arial, tahoma, verdana, sans-serif;
     font-size: 12px;
     text-align: justify;
     }
    
    td {
     font-family: arial, tahoma, verdana, sans-serif;
     font-size: 12px;
     align: center;
     text-valign: middle;
     } 
     
    /* Spezialfälle */
    
    td.mj05_menu {
     height: 24px;
    }
    
    a.mj05_menu {
     display: block;
     width: 100%; 
     height: 24; 
     font-family: arial, tahoma, verdana, sans-serif;
     font-size: 12px; 
     color: rgb(0, 0, 0);
     text-decoration: none;
     vertical-align: middle;
     text-align: center;
     padding: 0px; 
     }
     
    a:hover.mj05_menu { 
      background-color: rgb(138, 124, 114); 
     }
    Darf auch sonstige Kritik o.Ä. kommen

    Einen Kommentar schreiben:

Lädt...
X