css3中的zoom元素属性值测试
2016-07-28 17:07
555 查看
在样式表里头看到zoom:1的设置,很是好奇就去找了一些资料发现关于这个的讲述还是比较少。
理论知识
默认值:normal
适用于:所有元素
继承性:有
动画性:是
计算值:绝对长度
兼容性:
浅绿 = 支持
红色 = 不支持
粉色 = 部分支持
测试代码块
在Chrome中的效果图
理论知识
语法:
zoom:normal | <number> | <percentage>默认值:normal
适用于:所有元素
继承性:有
动画性:是
计算值:绝对长度
取值:
normal:使用对象的实际尺寸。<number>:用浮点数来定义缩放比例。不允许负值<percentage>:用百分比来定义缩放比例。不允许负值兼容性:
浅绿 = 支持红色 = 不支持
粉色 = 部分支持
Values | IE | Firefox | Chrome | Safari | Opera | iOS Safari | Android Browser | Android Chrome |
---|---|---|---|---|---|---|---|---|
Basic Support | 6.0+ | 2.0-40.0 | 4.0+ | 6.0+ | 15.0+ | 6.0+ | 2.1+ | 18.0+ |
<fieldset> <legend><h4>zoom属性说明</h4></legend> <span> <em>设置或检索对象的缩放比例</em>,对应的特性为zoom. <br/>当前主流的浏览器仅Mozilla Firefox(火狐浏览器)不支持zoom. </span> </fieldset> <p style="zoom: normal">normal</p> <p style="zoom: 1.5">number(No minus)</p> <p style="zoom: 60%">percentage(No minus)</p>
在Chrome中的效果图
相关文章推荐
- 块级元素、行内元素、空元素
- html表格样式
- CSS Border属性solid(实线)使用介绍
- CSS box-flex属性,然后弹性盒子模型简介
- 巧用cssText属性批量操作样式
- CSS学习笔记--基础(二)
- CSS学习笔记:inline和inline-block的区别
- checkbox样式自定义
- HTML篇之CSS样式——CSS水平垂直居中对齐(多种方式)
- css sprites
- 今天发现了css中的一个顺序问题
- HTML学习05-HTML样式(CSS)
- CSS3基础入门学习: 背景制作实例!
- html a链接样式
- WPF样式动画Trigger.EnterActions和Trigger.ExitActions(ExitActions其实可以不做任何事情)
- css-background属性
- HTML篇之CSS样式:<button></button>按钮变成超链接<a></a>的样式
- css中position:fixed;
- css中使用!important优先级最高问题
- CSS3中transform几个属性值的注意点