Question

1) Discuss the different image formats and the advantage of using them in the webpages, and discuss how they can use the CSS files to design websites and create their own style rules?

Answer 1

Image Format -

Image file organize and store digital image. Image file generally stores data in compressed, uncompressed or vector format.

Formats are -

1. Jpg - it follows lossy compression . Which significantly reduces file size . It supports 24 bit color images . And is most generally used. It is used for photography on web because of it's small image size which helps in easy page loading.
2. PNG - its full name is portable network graphics. It is a free and open source .As it creates larger file as compared to jpg format it's not that good for photography on web. But it's good for the images having some text .
3. Gif - it means Graphic Interchange format. It supports lossles compression having no loss of data. It's general use is in animation but not in photography because of it's limited color range.
4. Bitmap - it stands for bitmap image file. It supports lossless compression which allows images to have good quality resulting in high size. It is used when good quality image is needed.
5. WebP - it is a format which allows both lossless and lossy compression . It reduces the image size resulting in fast page loading on web.

CSS stands for cascading style sheet .it is used for design purpose .HTML adds image to web page while CSS only controls design . background-image property is used to set image on background . background-color sets the background color and background-repeat repeats the first image.

Example -

body {
background-image: url("abc.gif");
background-repeat: repeat;
background-color: #cccccc;
}

Height , background-position , background-size are other tags to design image .