• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

bilder auf html-seite in einheitlicher größe anzeigen

Status
Für weitere Antworten geschlossen.

hokage555

Neues Mitglied
hi all,

ich hab folgende frage:

wenn ich 10 bilder in unterschiedlichen größen durch den <img .../> tag auf einer website untereinander anzeigen will, dann werden alle bilder natürlich in ihrer jeweiligen größe angezeigt. ich würde aber gerne, dass alle bilder in einheitlicher größe angezeugt werden. ich weiß auch, dass manüber attribute die größe #ndern kann, doch dies bei jedem einzelnen pic zu machen ist etwas aufwendig. gibt es da auch andere möglichkeiten um oben genanntes ziel zu erreichen?
sry. wenn mein problem nicht so verständlich ist. dann fragt einfach nach.

danke schonmal an alle antworten

grüße hokage
 
Zum einen würde ich Dir empfehlen, die Bilder nicht vom Browser skalieren zu lassen, weil das nicht besonders schön aussieht. Wenn Du z.B. Thumbnails willst, um die durch Klick größer darzustellen, bietet es sich an, ein Grafikprogramm mit der Erstellung der Thumbnails zu bedienen.

Außerdem, wenn Du die Bilder alle in gleicher Größe darstellst, könnte es zu einer Verzerrung des Seitenverhältnisses kommen, das sieht dann auch greulich aus.

Du könntest zum einen das über CSS machen und einfach eine feste Größe für alle img definieren:
Code:
img {
  width:200px;
  height:300px;
}
Da bliebe aber die Empfehlung, Images auch Größenangaben per HTML-Attribute zu geben, damit der Browser beim Erzeugen der Seite gleich den benötigten Platz für die Images reservieren kann (tut man das nicht, "springt" die Seite u.U. so seltsam, das hast Du sicher schonmal beobachtet).

In HTML kannst Du aber sowas nicht automatisch für alle Images festlegen, wie das mit CSS geht.

Um das zu erreichen, und auch vielleicht um die Namen der darzustellenden Images aus einem Verzeichnis auszulesen, bräuchtest Du eine serverseitige Programmiersprache, z.B. PHP oder Perl, da kannst Du solche Sachen dann per Schleife realiseren.
 
danke schonmal für die antwort xD
an diesen css befehl hab ich auch eben gedacht, aber wie du schon sagst bringt auch dieser einige nachteile mit.
eine frage zu den thumbnails. hab noch nie selber welche gemacht
(gehört wahrscheinlich auch nicht mehr in diesen thread^^)
verstehe ich das richtig, dass ich von jedem originalbild einfach eine verkleinerte kopie mache und das originall bild dann einfach darauf verlinke?
oder sind thumbnails was komplett anderes.

zu dem vorschlag mit php...
leider hab ich damit sogut wie gar keine erfahrung und hätte keine ahnung wie ich sowas mit einer schleife realisieren sollte.
 
Vorschaubild – Wikipedia

Im Prinzip ist es ganz einfach.
Das Bild xyz.png hast du 2x. Einmal in Originalgröße (500x500px) und einmal in klein welches wir einfach mal xyz_klein.png (100x100px) nennen. Das kleine Bild ist das Thumbnail (auch Vorschaubild genannt), dass große das Originalbild welches du beim klicken auf das Thumbnail (das kleine) sich dann öffnet.

nun machst du einfach

Code:
<ul>
      <li> <a href="xyz.png"> <img src="xyz_klein.png" width="100" height="100" alt="ich bin das bild xyz" /> </a> 
      </li>
     ................
</ul>
im css kannst du nun auch noch, falls du es nicht möchtest dies angeben:

Code:
img { border: 0px; }
sonst hast du in manchen browsern einen unschönen rahmen um das bild.

Grüße
Loon3y
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben