HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

CHAPTER 8. IMAGE TRANSPARENCY 83


We will use a picture of myself. I have already
cropped the picture to be very close to the mate-
rial I want to keep. The original picture is much
bigger. We will continue by deleting everything
that is not me. We will make the deleted parts
transparent. We will save the resulting image as
a png file.


Here is the original picture we will use. It is
194x314 pixels, which will be a good size for our
finished web graphic.


Using Gimp Menu: Layer /
Transparency / Add Alpha
Channel, we create the ability
to have transparency in this im-
age. (Red, green, and blue are also
channels.)


We select the fountain-pen tool by double-clicking it.
This will let me click my way around the important part
of the picture, doing a selection that is irregular rather
than rectangular or circular. This tool is actually much
more powerful that what I am showing you. It creates a
B ́ezier curve.

Free download pdf