设为主页 加入收藏 进入管理 
千叶网典
首 页 网典文库 养生保健 美容化妆 旅游探险 精彩文章 美食菜谱 常用软件 网典资讯
当前位置: 千叶网典 - 网典文库/网站技术/em px 简单换算 - em px 简单换算  人气:12255 [返回] [刷新]
em px 简单换算
2014/1/8
大部分的网页设计者在CSS代码编写中总是先对整体定义字体尺寸,中文情况下一般为12px,而其实这样以来在通过IE顶部菜单中的“察看-文字大小”设置已无任何 作用。对字体感觉太小的浏览者而言无疑是种很不好的用户体验过程。其实这一切都可以避免,那就是使用em单位作为字体显示单位。

一、首先说下em和px的区别:
1. IE无法调整那些使用px作为单位的字体大小;

2. Firefox能够调整px和em,但是96%以上的中国网民使用IE浏览器(或内核)。

3.px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。

而em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。

二、em相对于px有什么优势:
1. em的值并不是固定的。

2. em会继承父级元素的字体大小。

三、em和px如何进行换算
任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。

为了简化font-size的换算,需要在css中的body选择器中先全局声明 Font-size=62.5%,很多初学者可能会在此定义0.625em或者直接定义12px,这是没有效果的,一定要定义font-size=62.5%!

这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10,然后换上em作为单位就行了。

由于em具有会继续父级出血元素的字体大小的特点,这使得1em=10px,所以12px=1.2em。px与em的转换通过10就可以得来,很方便了吧!

四、CSS中应用em需要注意两点:
1. body选择器中声明Font-size=62.5%。

2. 将你的原来的px数值除以10,然后换上em作为单位。

3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明。

也就是避免1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em,那么在声明 p 的字体大小时就只能是1em,而不是1.2em, 因为此em非彼em,它因继承#content的字体高而变为了1em=12px。

此外有一点必须要注意,在IE处理汉字时,对于浮点的取值精确度有限,在body下62.5%出来的12px字体比直接定义的要大一些,需要将 62.5%换成63%。通过以上对CSS代码的调整,你会发现自己的网站又向用户体验设计更靠近了一步。

上一篇: 如何上传代码到AppCan的服务器上 下一篇: Appcan开发之页面布局与CSS排版
网典文库
u英汉词典
u成语词典
u新华字典
u小说
u电脑技术
u网站技术
u哲理
u灵异
u史话
u经典
u历史
最近更新
·夏季持续出汗别立即擦干 汗液附着皮肤散热降温
·警惕运动误区:爬山打球伤膝盖 频率太高易受伤
·常吃肉类增加患癌风险 体重决定每日摄入量
·空腹血糖超5.6应查糖耐量 糖尿病前期可逆转
·妊娠纹只能预防很难去除 合理控制体重最重要
·夏季频上火别盲目降火 滋阴润燥多吃果蔬更重要
·人体结构决定最好睡姿为右侧卧 不会压迫心肺
·肝硬化早期有信号:面部颜色黝黑 男性乳房增大
·夏天出汗要擦干再走进空调房 否则易致汗腺闭塞
·夜尿频繁对老年人危害极大 小心容易摔倒和骨折
·治脚气要先祛湿 中药煎水外洗加外涂西药效果好
·20多岁坚持跑步不痴呆 有氧运动有益大脑健康
·过度劳累是气虚易得肺癌 怕冷是阳虚易得胃癌
·夏季睡觉别裸睡要护好肩颈 亚麻凉席是天然空调
·血压高的人别在早上散步 胖老人散步要走久些
友情链接
千叶在线英汉词典千叶在线成语词典千叶在线新华字典千叶养生网梦游百合花海千叶网典
  千叶网典 版权所有 青ICP备09001016号-2  青公网安备 63010302000121号 .