tutorials.de Buch-Aktion 05/2012
ERLEDIGT
NEIN
ANTWORTEN
8
ZUGRIFFE
1011
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 01.03.04 14:59 #1
    GreenThunder Tutorials.de Gastzugang
    Hallo,

    ich muss für die BS eine Website bauen, in der alle Formatangaben über CSS gemacht werden.
    Nun will ich auch einen Rand um meine Tabellen haben. Dies habe ich in HTML folgendermaßen gemacht:

    <table border="1" bordercolor="#00005F">
    Gibts ein Möglichkeit das in CSS zu erreichen? Hab bisher nix gefunden, was ähnlich aussah.

    Danke im vorraus.
     
  2. 01.03.04 15:07 #2
    Avatar von Martys
    Martys Martys ist offline
    Registriert seit
    May 2003
    Ort
    Ruhrpott
    Beiträge
    266
    wer suchet, der findet:

    sieh mal an
     
  3. 01.03.04 19:55 #3
    GreenThunder Tutorials.de Gastzugang
    Ja, das hab ich auch gefunden, aber die Rahmen, die ich möchte ist nicht dabei!
     
  4. 01.03.04 21:59 #4
    Avatar von Martys
    Martys Martys ist offline
    Registriert seit
    May 2003
    Ort
    Ruhrpott
    Beiträge
    266
    Dann sag mal, was Du genau haben willst, oder poste mal mehr Code!
     
  5. 02.03.04 09:49 #5
    GreenThunder Tutorials.de Gastzugang
    Ok, ich hab mal eine Beispielseite hochgeladen:

    http://www.fanclub-phoenix2001.de/tutorials/inhalt.html

    Ich möchte also diesen Doppelrahmen, so wie er hier zu sehen ist.

    HTML-Code:
    <html>
    <head>
    <title>inhalt</title>
    <link rel="stylesheet" href="format.css" type="text/css">
    </head>
    <body></body>

    <table border="1" bordercolor="#00005F">
    <tr><td class="ueberschrift">Warum diese Seite?</td></tr>
    <tr>
    <td class="text"><p >TESTTEXT</p>
    </td>
    </tr>
    </table>

    </body>
    </html>
    CSS-Code:

    body {
    background-color:#FFFFFF;
    margin-top:10;
    margin-left:5;
    font-size:10pt;
    font-family: ARIAL,HELVETICA;
    color:#0000FF;
    }

    td {
    font-size:10pt;
    font-family: ARIAL,HELVETICA;
    color:#0000FF;
    }

    .ueberschrift {
    font-size:10pt;
    font-weight:bold;
    font-family: ARIAL,HELVETICA;
    text-align:center;
    background-color:#00C0FF;
    margin-bottom:0pt
    }

    .text {
    font-size:10pt;
    font-family: ARIAL,HELVETICA;
    color:#0000FF;
    padding:10pt;
    text-align: justify;
    }
     
  6. 02.03.04 10:50 #6
    xollo xollo ist offline Mitglied Silber
    Registriert seit
    Feb 2004
    Beiträge
    80
    Hi,
    du mußt den Tabellenrahmen im CSS Code mit angeben.

    CSS- Code
    PHP-Code:
    body {
    background-color:#FFFFFF;
    margin-top:10;
    margin-left:5;
    font-size:10pt;
    font-family: ARIAL,HELVETICA;
    color:#0000FF;
    }

    table {
    border-color: #00005F;
    border-style: solid;
    border-width: 1px;
    }

    td {
    border-color: #00005F;
    border-style: solid;
    border-width: 1px;
    font-size:10pt;
    font-family: ARIAL,HELVETICA;
    color:#0000FF;
    }

    .    ueberschrift {
    font-size:10pt;
    font-weight:bold;
    font-family: ARIAL,HELVETICA;
    text-align:center;
    background-color:#00C0FF;
    margin-bottom:0pt
    }

    .    text {
    font-size:10pt;
    font-family: ARIAL,HELVETICA;
    color:#0000FF;
    padding:10pt;
    text-align: justify;
    } 
    HTML- Code
    PHP-Code:
    <html>
    <    head>
    <    title>inhalt</title>
    <    link rel="stylesheet" href="format.css" type="text/css">
    </    head>
    <    body></body>

    <    table >
    <    tr><td class="ueberschrift">Warum diese Seite?</td></tr>
    <    tr>
    <    td class="text"><p >TESTTEXT</p>
    </    td>
    </    tr>
    </    table>

    </    body>
    </    html> 
    gruss xollo
     
    Es ist leichter auf etwas zu verzichten als ewig vergeblich danach zu suchen.
  7. 02.03.04 10:58 #7
    Tim C. Tim C. ist offline
    Registriert seit
    Dec 2001
    Beiträge
    4.791
    Womit wir bei dem Problem wären, dass ein CSS border:1px solid #farbe (ich habe das jetzt mal in dem Sammel Attribut zusammengefasst) nicht das gleiche ist wie ein HTML border=1.

    Während du bei HTML um jede Zelle einen Rahmen hast, sorgt das CSS Border lediglich dafür, dass das gesamte Element, in diesem Falle die Tabelle, weil in <table> positioniert, mit einer 1px dicken Linie umgeben wird.

    Die HTML border=1 Linie ist aber weder nur 1px dick, noch nur aussen um die Tabelle herum.

    Somit möchte ich behaupten, dass eine adequate 1 zu 1 Darstellung der HTML Border mit CSS nicht zu realisieren ist.

    //edit: ich stelle gerade fest, dass mein Vorredner doch schon die Idee mit dem border für table und td aufgegriffen hatte, da bei ihm jedoch der Aspekt des paddings im table-tag fehlt, der für den Abstand zwischen äusserer und innere border sorgt, lasse ich die folgende Ausführung als Ergänzung trotzdem mal online

    Wenn du allerdings an einer nicht-adequaten, schweinemäßig aufwendingen Lösung interessiert bist, dann spiele mal mit folgendem Gedanken.
    Code :
    1
2
3
4
5
6
7
8

    <table style="width:200px; height:100px; padding:3px; border:1px solid #000000;">
<tr>
    <td style="border:1px solid #000000;">&nbsp;</td>
</tr>
<tr>
    <td style="border:1px solid #000000;">&nbsp;</td>
</tr>
</table>
    Jetzt musst du nur noch für den tollen "3D Effekt" der oberen und linken Border eine andere Farbe geben als der rechten und unteren. Das lässt sich dann über Klassen machen und tja ... dann hätten wir das Problem gelöst, aber wenn ich scharf auf HTML-Border-lookalike Rahmen bin, dann mache ich halt einfach border="1" in den Table Tag und frimmel mir da nicht 'nen Wolf in CSS.
     
  8. 02.03.04 11:18 #8
    GreenThunder Tutorials.de Gastzugang
    Original geschrieben von Tim Comanns
    ... aber wenn ich scharf auf HTML-Border-lookalike Rahmen bin, dann mache ich halt einfach border="1" in den Table Tag und frimmel mir da nicht 'nen Wolf in CSS. [/B]
    Ja, so sehe ich das auch, aber mein Lehrer in der Berufsschule will halt ALLE Formatangaben im CSS haben.


    *edit*
    @ Xollo

    Danke, das hat mir geholfen! Es stellt mich nun zwar an andere Stelle vor Probleme, aber ich krieg das sicher schon hin
    Geändert von GreenThunder (02.03.04 um 11:23 Uhr)
     
  9. 02.03.04 11:21 #9
    Tim C. Tim C. ist offline
    Registriert seit
    Dec 2001
    Beiträge
    4.791
    Original geschrieben von GreenThunder
    Ja, so sehe ich das auch, aber mein Lehrer in der Berufsschule will halt ALLE Formatangaben im CSS haben.
    Dann schau dir doch mal meine längere Ausführung und die von xollo an. So sollte es eigentlich zu lösen sein.
     
« Farbwechsel in einem Schweiff | Auswahlliste nach oben aufklappen »

Ähnliche Themen

  1. Tabellenrand
    Von hury im Forum HTML & XHTML
    Antworten: 1
    Letzter Beitrag: 06.10.09, 05:30
  2. tabellenrand
    Von CosmoKey im Forum HTML & XHTML
    Antworten: 2
    Letzter Beitrag: 26.01.05, 16:14
  3. Tabellenrand 1px
    Von matthiasschnueriger im Forum HTML & XHTML
    Antworten: 5
    Letzter Beitrag: 06.07.04, 11:40
  4. tabellenrand
    Von qqpp im Forum CSS
    Antworten: 2
    Letzter Beitrag: 19.09.03, 17:40
  5. 1px Tabellenrand
    Von ~SpArGs~ im Forum HTML & XHTML
    Antworten: 7
    Letzter Beitrag: 27.12.01, 11:10