kostenloser Webspace werbefrei: lima-city


Bilder an Fenstergröße anpassen

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    rennstreckeninfo

    rennstreckeninfo hat kostenlosen Webspace.

    Hallo,

    ist es möglich, dass man Bilder automatisch an die Fenstergröße anpassen kann?

    Meine Webseite besteht aus einen linken und einen rechten Bereich. Links die Navigation, rechts der Inhalt. Den linken Bereich habe ich einen festen Wert gegeben, der rechte Bereich passt sich automatisch an die Fenstergröße an. Ich möchte auf der rechten Seite Bilder rein setzen. Den Bildern kann ich ja eine Größe in px zuweisen. Mein Problem ist jetzt, wie bekomm ich es hin, dass die Bilder sich automatisch verkleinern, wenn die Fensterbreite es erfordert. Es sieht blöd aus, wenn sich der Text an die Fenstergröße anpasst und man das Bild scrollen müsste.

    Für ein paar hilfreiche Tips wäre ich sehr dankbar.

    Beispielseite http://rennstreckeninfo.lima-city.de/beispiel.html
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. t************o

    rennstreckeninfo schrieb:
    Hallo,

    ist es möglich, dass man Bilder automatisch an die Fenstergröße anpassen kann?

    Meine Webseite besteht aus einen linken und einen rechten Bereich. Links die Navigation, rechts der Inhalt. Den linken Bereich habe ich einen festen Wert gegeben, der rechte Bereich passt sich automatisch an die Fenstergröße an. Ich möchte auf der rechten Seite Bilder rein setzen. Den Bildern kann ich ja eine Größe in px zuweisen. Mein Problem ist jetzt, wie bekomm ich es hin, dass die Bilder sich automatisch verkleinern, wenn die Fensterbreite es erfordert. Es sieht blöd aus, wenn sich der Text an die Fenstergröße anpasst und man das Bild scrollen müsste.

    Für ein paar hilfreiche Tips wäre ich sehr dankbar.

    Beispielseite http://rennstreckeninfo.lima-city.de/beispiel.html

    Ich persönlich kann dir nicht direkt helfen, aber hier hast eine Website (auf englisch :) ) die dir vermutlich helfen könnte
    http://css-tricks.com/perfect-full-page-background-image/

    Bzw. hier auch über HTML in dem man die Bildgrößen in % angibt
    http://www.tutorials.de/html-xhtml/20446-bild-soll-sich-der-fenstergroesse-anpassen.html
    Andernfalls hilft Google gerne :)

    Beitrag zuletzt geändert: 25.2.2013 19:34:05 von theaustrianpro
  4. m******e

    theaustrianpro schrieb:
    Ich persönlich kann dir nicht direkt helfen, aber hier hast eine Website (auf englisch :) ) die dir vermutlich helfen könnte
    http://css-tricks.com/perfect-full-page-background-image/
    Es geht nicht um eine Hintergrundgrafik.

    rennstreckeninfo schrieb:
    Mein Problem ist jetzt, wie bekomm ich es hin, dass die Bilder sich automatisch verkleinern, wenn die Fensterbreite es erfordert.
    Eine Möglichkeit wäre:
    <span style="width:100%"><img src="bilder/beispielbild.png" width="100%" height="" alt=Beispielbild""></span>
    Beispiel

    Allerdings würden Bilder auf diese Weise auch vergrößert, sollten sie zu klein sein.
  5. Autor dieses Themas

    rennstreckeninfo

    rennstreckeninfo hat kostenlosen Webspace.

    Danke, ihr habt mir schon weiter geholfen.
    Werde den Lössungsvorschlag von menschle mit richtigen Bilder, die ich einstellen will, mal testen.
    Wenn jemand noch andere Vorschläge hat, gern her damit.
  6. rennstreckeninfo schrieb:
    Danke, ihr habt mir schon weiter geholfen.

    Nur bedingt! Wenn es um medienübergreifende Darstellung deiner Inhalte geht (Sprich: Deine Website soll auf div. Monitoren und eventuell auch auf Tablet und Smartphone nutzbar sein), sind die Bilder nur ein ganz kleiner Teil deines Problems. :wink:

    Hast Du schon mal geschaut, wie deine Website aussieht, wenn Du das Browserfenster schmaler machst, ode rmit einem Handhelddevice surfst?
    Gehe ich auf klassische Smartphonebreite, sind Bilder irrelevant, da ich grundsätzlich nix vom Content sehen kann. Mehr als Navi und dann seeeeeehr viel schwarze Fläche gibt es, ohne Scrollorgie, nicht zu sehen.

    Beitrag zuletzt geändert: 26.2.2013 3:05:28 von fatfreddy
  7. Autor dieses Themas

    rennstreckeninfo

    rennstreckeninfo hat kostenlosen Webspace.

    Hast Du schon mal geschaut, wie deine Website aussieht, wenn Du das Browserfenster schmaler machst,

    Ja habe ich. Dabei fiel mir das mit dem Bild auf.

    Nur bedingt! Wenn es um medienübergreifende Darstellung deiner Inhalte geht (Sprich: Deine Website soll auf div. Monitoren und eventuell auch auf Tablet und Smartphone nutzbar sein), sind die Bilder nur ein ganz kleiner Teil deines Problems.

    Wie sollte ich meine Seite deiner Meinung nach aufbauen? Ich mache das zum ersten mal. Wenn du mir paar Stichpunkte nennst, könnte ich dann daran arbeiten. Mit Smartphone und Tablet kann ich es leider nicht testen.
  8. h**s

    ...Ich mache das zum ersten mal. Wenn du mir paar Stichpunkte nennst, könnte ich dann daran arbeiten...


    Stichpunkte:
    - Responsive Design
    - CSS-Media-Querys
  9. Autor dieses Themas

    rennstreckeninfo

    rennstreckeninfo hat kostenlosen Webspace.

    Stichpunkte:
    - Responsive Design
    - CSS-Media-Querys

    Mal Tante Google fragen was das ist. Danke schonmal.
  10. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!