CSS to control image size?

Question

Had a quick question about using CSS to contorl the image
size. I have 50 or 60 images that will show up throughout the site
(project portfolio); however, I also need about 30 of these images
to appear as thumbnails in various parts of the site... I know in
Dreamweaver after insterting the image I can downsize it, but is it
possible to set a CSS setting to resize certain images in given
table cells? Please send me a word of guidance (or perhaps another
way to display the same image in different sizes, without uploading
another smaller one). Thanks.

Answer 1

I have an entire site where the thumbnails are set to be
50x50 through CSS even though they're actually 60x60. It works
quite reliably. You can either put the class on the cell or the
image itself.
If you put it on the cell:
td.shrinkme img {width: 50px; height: 50px;}
<td class="shrinkme"><img src="blah.jpg">
If you put it on the image:
img.shrinkme {width: 50px; height: 50px;}
<img class="shrinkme">
Just remember, though, that even though you're setting the
dimensions of how it appears onscreen, the file size stays the
same, which could slow page loading considerably. If it's just a
matter of not being able to decide between 75x75 and 100x100, it's
only a few kb difference; but if you're taking a 400x400 and
telling it to be 75x75, that's a big deal. You probably already
knew this, but some people don't.