Common Front-end image display methods and common image display Methods

Common Front-end image display methods and common image display Methods

1. png/jpg/GIF image ------- general image format, easy to use, simple and flexible, but occupies space, scaling will be distorted.

2. svg image ------- scaling is not distorted and occupies a small amount of space. You can edit and modify the image. You can introduce svg files externally or use <svg> label embedding, but the color is relatively simple, you cannot make too many color images, or use a Microsoft browser of less than ie8.

3. base64 image ------- scaling is not distorted and occupies no space, which facilitates network transmission. However, it can only be small-sized images that are not often updated.

4. iconfont/webfont image ------- scaling is not distorted and occupies a small amount of space. It is as easy to edit and modify as svg. It is more suitable for making icons because css attributes are modified.