zoukankan      html  css  js  c++  java
  • fontsize 放弃px 选择em

    ---------(转)Alimanman

    在如今这个提倡可用性设计以及用户体验设计的网络时代,CSS也是要一同参与其中的。大部分人在CSS代码编写中总是先对整体定义字体尺寸,中文情况下一般为12px,而其实这样以来在通过IE顶部菜单中的“察看-文字大小”设置已无任何作用。对字体感觉太小的浏览者而言无疑是种很不好的用户体验过程。其实这一切都可以避免,那就是使用em单位作为字体显示单位。
      
    浏览器的默认字体高都是16px,所以未经调整的浏览器在显示1em=16px。换算过来的话也就是说1px=0.0625em,也就是12px= 0.75em, 10px=0.625em,通过1px=0.0625em大家可以在CSS编写时通过px转换成em。不过还有一种更方便的方法,继续往下看!
      
    这种方法要用到%单位(仅1次),其实%和em简单的话可以理解成前者只是比后者多2个0。为了简化font-size的换算,大家可以在css中的 body中先全局声明font-size=62.5%,这里的%的算法和em一样,100%=16px,1px=6.25%,10px=62.5%,也就是定义了默认字体大小为10px。很多初学者可能会在此定义0.625em或者直接定义12px,这是没有效果的,一定要定义font-size= 62.5%!由于em具有会继承父级出血元素的字体大小的特点,这是的1em=10px,所以12px=1.2em。px与em的转换通过10就可以得来,很方便了吧!
      
    此外有一点必须要注意,可能是IE处理汉字时,对于浮点的取值精确度有限,在body下62.5%出来的12px字体比直接定义的要大一点点,只要将 62.5%换成63%就可以了。通过以上对CSS代码的调整,你会发现自己的网站又向用户体验设计更靠近了一步,在如今这个提倡可用性设计以及用户体验设计的网络时代这是很重要的。

  • 相关阅读:
    链表操作 —— 61_链表旋转
    链表操作 —— 25_k个一组翻转链表
    链表操作 —— 19_删除链表倒数第N个结点
    链表操作 —— 1. 2_两数相加
    Hash相关 —— 2. 387_字符串中的第一个唯一字符
    Hash相关 —— 1. 1_两数之和
    Maven02-Maven 仓库、生命周期、插件、镜像
    mvn test 运行测试不显示测试统计信息和测试结果
    Maven 概述
    Spring源码03---parseDefaultElement
  • 原文地址:https://www.cnblogs.com/TSPWater/p/1573098.html
Copyright © 2011-2022 走看看