The zoom property in CSS is used to scale-up or scale-down the content. This property was implemented for Internet Explorer before the latter is supported by a few other browsers.
zoom: percentage | number | normal;
Property Value: This property accepts three types of values as mentioned above and described below:
- percentage: This property holding the numbers with the percentage that will increased or decreased compared to the original content makes that zoom-in or out depending on the numbers like
zoom:150%;. It means the content will be 150% percentage bigger than the original content.
- number: This property holds the number that will be multiplied by the original content makes that zoom-in or out depending on the number like
zoom:1.5;. It means the content will be 1.5 times bigger than the original content.
- normal: This property holds the normal content which is not zoomed in or out, basically this property is telling the browsers
Example: This example uses CSS zoom property to resize the image.
Supported Browsers: The browsers supported by CSS zoom property are listed below:
- Google Chrome
- Internet Explorer
- How to adjust CSS for specific zoom level?
- How to disable zoom on a mobile web page using CSS?
- CSS | transition-property Property
- CSS | nav-right property
- CSS | nav-down property
- CSS | top Property
- CSS | nav-up property
- CSS | right Property
- CSS | all Property
- Web API | DOMRectReadOnly y property
- CSS | bleed property
- CSS | grid-row-end Property
- CSS overflow-y Property
- CSS | clip Property
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.