HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

CHAPTER 8. IMAGE TRANSPARENCY 82


8.1 Irregular Shapes and Transparency


You probably know that the human eye contains a retina, and the retina is
composed of cones and rods. The rods detect black and white. The cones
detect only three colors: red, green, and blue.


Computer images commonly use the RGB model that is made up of layers
or channels: red, green, and blue. Color printers commonly use the CMYK
model that uses four colors of ink: cyan, magenta, yellow, and black.


The red, green, and blue channels each tell how much of that color of light
should be shown at each point of the image.


For transparency, we simply invent a new channel to tell how transparent
or opaque the image should be at each point.


To do irregular shapes, the easiest method is to use the alpha channel to
create transparency in parts of the image. Not all file formats support
transparency. PNG is probably the best one to use.


Exam Question 138 (p.344): Does the .gif image file format support
transparency?
Required Answer:yes


Exam Question 139(p.344): Does the .jpg image file format support
transparency?
Required Answer:no


Exam Question 140(p.344): Does the .png image file format support
transparency?
Required Answer:yes


In this section we show you how to make an irregularly-shaped image. Re-
ally, though, the image will be rectangular just like always, but parts of it
will be transparent.

Free download pdf