What is the best way to crop an image in HTML?

Question

What is the best way to crop an image in HTML?

It would be something like the following:

<img src="something.gif" x1="10" y1="10" x2="20" y2="20">

If that doesn't work, then I'll just use GIMP. Any thoughts on how I can get this to work programmatically?

Answer 1

That's called sprites, you can read this fantastic article of A List Apart.

In the end it boils down to:

#panel2b {
    width:50px;
    height:30px;
    background: transparent url(test-3.jpg) -96px -200px no-repeat;
}

Answer 2

You can also use a tool like this web based CSS Sprite Generator to create a larger image if you have many slices.

[Someone on my similar question led me to yours].