Image Gallery: ============== ==> Collection of images, that each image can define with hover effect. pre-requisites: div tag img tag Image Gallery ====================================================== transform: ========== ==> it is a CSS property can use to scale or rotate an element. Syntax: transform : scale(value); transform : rotate(value-deg); transition: =========== ==> it is a CSS property can be used to apply the transformation linearly/gradually. Syntax: transition : transform time-in-sec; ================================================== Background styles: ================== 1) background-image ==================== ==> to set the image as the background, we can use "background-image" property. Syntax: background-image : url("file location); 2) background-repeat: ====================== when the background-image resolution is smaller than our screen resolution, then: the image can be repeated for several times. ==> to specify whether the background image need to be repeated or not we have to use "background-repeat" property. Syntax: background-repeat : repeat | no-repeat | repeat-x | repeat-y; 3) background-size: =================== if the background-image with no-repeat, then: background-size can be defined. Syntax: background-size : auto height width flex; 4) background-position: ======================= ==> to set the position for the background-image, we have to use "background-position". Syntax: background-position : top | left top | right top | center top | center | left center | right center | center center | bottom | left bottom | right bottom | center bottom; Image Gallery