CSS3 Examples

CSS ZOOM

Written by jon on 12:17 AM This property controls the magnification level for the current element. The rendering effect for the element is that of a “zoom” function on a camera. Even though this property is not inherited, it still affects the rendering of child elements.

Example

div { zoom: 200% } <div style=”zoom: 200%”>This is x2 text </div>

Possible Values

Value Description normal No magnification is applied. The object is rendered as it normally would be. [number] Positive floating point number indicating a zoom factor. Numbers smaller than 1.0 indicate a “zoom out” or size reduction effect, while numbers greater than 1.0 indicate a magnifying effect. [percentage] Positive floating point number, followed by a percentage character (”%”) which indicates a zoom factor. Percentages smaller than 100% indicate a “zoom out” or size reduction effect, while numbers greater than 100% indicate a magnifying effect.