FF下zoom的替代方案单位em- Javascript - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > FF下zoom的替代方案单位em

Javascript: 阻止JavaScript事件冒泡传递（cancelBubble 、stopPropagation）; (转载)JavaScript中匿名函数，函数直接量和闭包; 简单的无缝滚动程序-仅几行代码; Javascript中的数学函数集合; javascript之大字符串的连接的StringBuffer 类; javascript之对系统的toFixed()方法的修正; 用javascript实现自定义标签; js在客户端验证密码强度，兼容FireFox和IE; javascript背景颜色按时变换; 脚本分析、压缩、混淆工具 JSA新版本发布，压缩效率提高大约10％; javascript语句中的CDATA标签的意义; 用javascript实现分割提取页面所需内容; 网上抓的一个特效; js之点击超连接,提示一个层.点击空白.层消失; 模拟用户操作Input元素，不会触发相应事件; 弹出广告特效代码(一个IP只弹出一次); (仅IE下有效)关于checkbox 三态; JavaScript Archive Network 集合; 关于__defineGetter__ 和__defineSetter__的说明; textContent在Firefox下与innerText等效的属性

No. « ‹ 66 67 68 69 › »

技术文章搜索

关键字

Javascript 中的 FF下zoom的替代方案单位em

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 271 ::

收藏到网摘: n/a

鼠标放上去触发一个javascript提示框效果代码 json编写简单一例

css 属性zoom是ie私有属性在FF中（或者说仅实现CSS标准的其他浏览器中）无法使用，一直在网上搜索它的替代方案，但没有收获，后来听群里有朋友说em或可解决此问题，经过研究和测试，发现果然可以解决。首先是em的计算方式，当本元素和父级元素没有指定以em或者百分比为单位的font-size时，1em严格等于16px,当本元素和父级元素指定了以em或者百分比为单位的font-size时，则在16px的基础上乘以所有上级fontSize的积。
由这个性质可以通过设置line-height来代替zoom以达到想要的效果。

点击运行可以看到效果:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS单位em</title>
<style type="text/css">
span{
font-size:16px;
}
.domain{
padding:15px;
}
</style>
</head>
<body>
<span>正常的1em=16px</span>
<div style="display:inline-block;width:1em;height:1em;background:green;"></div>
<div class="domain" style="font-size:2em;border:solid 1px red;">
<span>style="font-size:2em;border:solid 1px red;"
这里1em=2x16=32px</span>
<div style="display:inline-block;width:1em;height:1em;background:green;"></div>
<div class="domain" style="font-size:3em;border:solid 1px blue;">
<span>style="font-size:3em;border:solid 1px blue;"
这里1em=2x3x16=96px</span>
<div style="display:inline-block;width:1em;height:1em;background:green;"></div>
<div class="domain" style="font-size:50%;border:solid 1px black;">
<span>style="font-size:50%;border:solid 1px black;"
这里1em=2x3x50%x16=48px</span>
<div style="display:inline-block;width:1em;height:1em;background:green;"></div>
</div>
</div>
</div>
</body>
</html>

[Ctrl+A 全选提示:你可先修改部分代码,再按运行]

鼠标放上去触发一个javascript提示框效果代码 json编写简单一例

Javascript 中的 FF下zoom的替代方案 单位em

评论 (0) All

Javascript 中的 FF下zoom的替代方案单位em