HTML Layout erstellen

  • HTML

Es gibt 5 Antworten in diesem Thema. Der letzte Beitrag () ist von Patrick1993.

    HTML Layout erstellen

    Guten Abend :)!

    Ich kann zwar schon einiges was PHP und Konsorten betrifft, aber ich habe vor allem Schwierigkeiten was das Design betrifft, also die ganzen Sachen wirklich dort und da hinzupacken, wo sie auch hin sollen.

    Ich mach momentan eine kleine Web-App, die dann auf Smartphones laufen soll und da finde ich dieses Layout hier ziemlich schön. (Header, also wo Optionen steht usw. ist erstmal Wurst)
    Hat jemand Ahnung wie man das am besten bewerkstelligen kann?

    Für die Entwicklung mobiler Seiten schien mir ja das hier noch ganz wichtig:

    HTML-Quellcode

    1. <meta name="viewport" content="width=device-width, initial-scale=1.0">


    Um das Layout im Anhang zu betrachten:
    - eine HTML Table mit 2 Spalten und 4 Reihen
    - Images darin
    - die Images mit Link versehen
    ..

    Aber wie bekomme ich jetzt alles auf die Breite und Höhe des Smartphones fixiert?
    Ich möchte ja letztendlich das die gesamte Table + Sub-Elemente auf die maximale Breite/Höhe gezogen werden.

    Vielen Dank schonmal!
    Bilder

    • Screenshot_2015-01-22-20-04-09.png

      283,55 kB, 1.080×1.920, 155 mal angesehen
    Polling is trolling!

    Achtung: Ich habe die komische Angewohnheit, simple Dinge zu verkomplizieren..

    Ich verstehe das Problem nicht ganz?
    Wenn du quadratische Bilder hast, kannst du die Width des <td> vermutlich auf 50% setzen
    und dann nach links floaten. Wenn die background-size-Eigenschaft auf "cover" steht sollte das Element dann quadratisch werden.
    Keine Garantie dafür. Würde eventuell einzelne <div> einer Table vorziehen, die Arbeit mit Tables ist... nicht das Beste. War das dein Problem?

    Grüße
    "Life isn't about winning the race. Life is about finishing the race and how many people we can help finish the race." ~Marc Mero

    Nun bin ich also auch soweit: Keine VB-Fragen per PM! Es gibt hier ein Forum, verdammt!

    Habs jetzt so soweit hinbekommen:

    Quellcode

    1. <style>
    2. table {
    3. width:100%;
    4. height:100%;
    5. }
    6. td {
    7. width:50%;
    8. height:25%;
    9. background-position:center;
    10. }
    11. img {
    12. background-position:center;
    13. }
    14. </style>


    Allerdings sind die BIlder innerhalb der "Zellen" trotzdem nicht zentriert :0?

    EDIT:
    Habs -

    Quellcode

    1. <td align="center">


    Ich sachs ja, immer wenn ich rumhampel - bekomm ichs erst nicht hin.
    Dann poste ich hier im Forum und warte auf Antwort - zack klappts xD..
    Polling is trolling!

    Achtung: Ich habe die komische Angewohnheit, simple Dinge zu verkomplizieren..

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von „Rootbob91“ ()

    Ich nutze Bootstrap da ist die Mobile Device geschichte direkt mit drin

Facebook
Telefonspende