Head First HTML and CSS-add images to your page, headcss
In short, JPEG is suitable for photo and complex images, while PNG or GIF is suitable for monochrome images, logos, and geometric images.
- JPEG: Suitable for continuous-tone images, such as photos; can represent 16 million different color images; "lossy" format, information loss during compression; does not support transparency and animation; small files.
- PNG: Suitable for monochrome images and lines consisting of images, such as logo, clip art, small text in the image; can represent millions of colors, PNG three, PNG-8, PNG-24, PNG-32; "lossless format", no information is lost during compression; "Transparent" is allowed; the file is larger than JPEG, and the number of colors should be used compared with GIF.
- GIF: similar to PNG, it is suitable for images consisting of monochrome images and lines, such as logo, clip art, and small text in the image. It can represent up to 256 colors; "lossless" format; only one color can be set to "Transparent". The file is larger than JPEG. animation is supported.
2.
the element is an inline element. The src attribute specifies the position of the image file. The alt attribute is a meaningful description of the image.
3. If you place a transparent image on a Web page, make sure that the mask color of the image is consistent with the background color of the Web page.