Ankündigung

Einklappen
Keine Ankündigung bisher.

Tabellen Design

Einklappen

Neue Werbung 2019

Einklappen
Dieses Thema ist geschlossen.
X
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Tabellen Design

    Hallo,

    Ich habe ein Tabellen Design.
    PHP-Code:
    <table id="Tabelle_01" border="0" cellpadding="0" cellspacing="0">
        <
    tr>
            <
    td rowspan="13"></td>
            <
    td colspan="7">
              <
    img src="Bilder/Website_02.png" width="591" height="16" alt=""></td>
            <
    td colspan="10" rowspan="2">
                <
    img src="Bilder/Website_03.png" width="533" height="31" alt=""></td>
            <
    td rowspan="13">
                <
    img src="Bilder/Website_04.png" width="196" height="2000" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="16" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_05.png" width="45" height="26" alt=""></td>
            <
    td colspan="4" rowspan="2">
                <
    img src="Bilder/Website_06.png" width="291" height="26" alt=""></td>
            <
    td colspan="2" rowspan="2">
                <
    img src="Bilder/Website_07.png" width="255" height="26" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="15" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_08.png" width="184" height="21" alt=""></td>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_09.png" width="10" height="21" alt=""></td>
            <
    td colspan="2" rowspan="2">
                <
    img src="Bilder/Website_10.png" width="184" height="21" alt=""></td>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_11.png" width="10" height="21" alt=""></td>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_12.png" width="60" height="21" alt=""></td>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_13.png" width="10" height="21" alt=""></td>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_14.png" width="51" height="21" alt=""></td>
            <
    td colspan="2" rowspan="2">
                <
    img src="Bilder/Website_15.png" width="24" height="21" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="11" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="7" rowspan="2">
                <
    img src="Bilder/Website_16.png" width="591" height="223" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="10" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="10">
                <
    img src="Bilder/Website_17.png" width="533" height="213" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="213" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="17">
                <
    img src="Bilder/Website_18.png" width="1124" height="51" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="51" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="17">
                <
    img src="Bilder/Website_19.png" width="1124" height="44" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="44" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="17">
                <
    img src="Bilder/Website_20.png" width="1124" height="1582" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="1582" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="2" rowspan="4">
                <
    img src="Bilder/Website_21.png" width="238" height="57" alt=""></td>
            <
    td colspan="4">
                <
    img src="Bilder/Website_22.png" width="129" height="14" alt=""></td>
            <
    td colspan="4" rowspan="4">
                <
    img src="Bilder/Website_23.png" width="601" height="57" alt=""></td>
            <
    td colspan="7">
                <
    img src="Bilder/Website_24.png" width="156" height="14" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="14" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td>
                <
    img src="Bilder/Website_25.png" width="63" height="15" alt=""></td>
            <
    td rowspan="4">
                <
    img src="Bilder/Website_26.png" width="7" height="44" alt=""></td>
            <
    td colspan="2">
                <
    img src="Bilder/Website_27.png" width="59" height="15" alt=""></td>
            <
    td rowspan="3">
                <
    img src="Bilder/Website_28.png" width="1" height="43" alt=""></td>
            <
    td colspan="5" rowspan="2">
                <
    img src="Bilder/Website_29.png" width="132" height="22" alt=""></td>
            <
    td rowspan="2">
                <
    img src="Bilder/Website_30.png" width="23" height="22" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="15" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td rowspan="3">
                <
    img src="Bilder/Website_31.png" width="63" height="29" alt=""></td>
            <
    td colspan="2" rowspan="3">
                <
    img src="Bilder/Website_32.png" width="59" height="29" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="7" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="6">
                <
    img src="Bilder/Website_33.png" width="155" height="21" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="21" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td colspan="2">
                <
    img src="Bilder/Website_34.png" width="238" height="1" alt=""></td>
            <
    td colspan="11">
                <
    img src="Bilder/Website_35.png" width="757" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="1" alt=""></td>
        </
    tr>
        <
    tr>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="180" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="45" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="193" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="63" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="7" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="28" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="31" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="224" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="184" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="10" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="183" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="10" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="60" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="10" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="51" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="1" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="23" height="1" alt=""></td>
            <
    td>
                <
    img src="Bilder/Abstandhalter.gif" width="196" height="1" alt=""></td>
            <
    td></td>
        </
    tr>
    </
    table
    Ziemlich lang.
    Kann mir einer ein tipp geben wie ich dies zu ein div design hinbekomme?


  • #2
    Zitat von coolerj Beitrag anzeigen
    Ich habe ein Tabellen Design.
    Von dem kein Mensch hier weiß, wie es letztendlich aussehen soll.

    Kann mir einer ein tipp geben wie ich dies zu ein div design hinbekomme?
    „Div Design“ ist ein blödsinniger Ausdruck.


    Man schreibt zuerst semantisch sinnvolles HTML, das die Struktur der Inhalte bestmöglich auszeichnet.
    Anschließend formatiert man dieses dann mit CSS.

    Dabei überlegt man sich, welche Bilder tatsächlich Inhalt transportieren - die kommen als IMG-Elemente mit sinnvollem alt-Text ins HTML.
    Alle anderen Bilder sind Verzierung, werden also per CSS als Hintergrundbilder untergebracht.

    Soweit die grobe Faustregel - Abweichungen in Sonderfällen sind möglich.


    Das kann man natürlich nicht von jetzt auf gleich, sondern das muss man üben. Also fang damit an.

    Kommentar


    • #3
      Also ich versteh dich jetzt nicht ganz.

      Kommentar


      • #4
        Sieht aus wie eine von Photoshop erzeugte HTML-Datei.

        Also ich versteh dich jetzt nicht ganz.
        Was verstehst du nicht?

        Wobei es bei HTML hauptsächlich geht, ist die Semantik. Wenn dir das klar ist, brauchst du dir nur die korrekten HTML-Elemente - darunter Überschriften, Absätze, Listen, Tabellen - schnappen und damit die Inhalte deiner Seite auszeichnen.
        http://hallophp.de

        Kommentar


        • #5
          Zitat von coolerj Beitrag anzeigen
          Also ich versteh dich jetzt nicht ganz.
          Das ist eine der dümmstmöglichen Antworten.

          Wenn du ein konkretes Verständnisproblem hast - dann frage bitte auch konkret nach.
          Nur mit „versteh ich nich“ können wir dir auch nicht weiterhelfen.


          Neben SELFHTML kann ich dir als Einstieg noch folgendes empfehlen, wenn du den Umgang mit HTML und CSS wirklich erlernen willst: http://jendryschik.de/wsdev/einfuehrung/

          Kommentar


          • #6
            Schon klar aber ich komme einfach mit div anordungen nicht zurecht.

            Hier mal ein Screen
            Angehängte Dateien

            Kommentar


            • #7
              Was soll man sagen? Dann musst Du es lernen.


              [MOD: Thread geschlossen]
              --

              „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
              Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“


              --

              Kommentar


              • #8
                Zitat von coolerj Beitrag anzeigen
                Schon klar aber ich komme einfach mit div anordungen nicht zurecht.
                Noch mal: Sinnvoller Aufbau einer Webseite fängt mit den Inhalten an.

                Nur solch ein Bildchen irgendwie „mit DIVs“ umzusetzen ist Nonsense, damit hast du gegenüber einem Tabellenlayout auch nicht viel gewonnen.

                Kommentar


                • #9
                  Tolles Bild, ja.

                  Verrat uns mal, was wir damit anfangen sollen. Du hast alle nötigen Information, die du brauchst. Von jetzt auf gleich und mit einem Fingerschnippen wirst du das auch bestimmt nicht umsetzen können, aber anstatt immer wieder zu betonen, dass du es nicht kannst, löst dein Problem auch nicht.
                  http://hallophp.de

                  Kommentar

                  Lädt...
                  X