在mobile web设计 中,我们常常需要使用em这个字体大小的单位。em到底是多少呢?

em到底应该设置为多少个em呢?通常换算成方法是1em=target fontsize we want/fontsize of containing element  ,比如我们设置html tag的font-size为默认的16px, 为了换算方便,我们把body的font-size设置为10px,也就是说browser的默认font-size为10px,对于body来说,其context就为html的font-size(16px),因此body{font-size: 62.5%;/*1em=10px作为基线*/}h1希望设置为30px,则h1的em值应该设置为30px/10px=3em

当在一个element上设置flexible margin时,context是元素的container的width

当在一个element上设置flexible padding时,context是元素本身的width!

fluid site: Fluid grid, Relative values(percentages);

对于line-height属性我们也可以设置为em和300%的百分比或者直接为3的数字,这个百分比和数字的区别在于300%要先根据font-size计算后再继承进line-height中,而3这个数字则直接从font-size中继承

mobile webiste 中的css的font-size em及line-height等换算的更多相关文章

  1. TP5.1:将外部资源引入到框架中(css/js/font文件)

    为了让我们的框架形式变得更加好看,我们需要加入Bootstrap和Jq文件到框架中 1.通过Bootstrap和jq官网进行相关文件的下载 (1)Bootstrap下载地址:https://v3.bo ...

  2. 使用二分法查找mobile文件中区号归属地

    #!/usr/bin/env python #coding:utf-8 ''' Created on 2015年12月8日 @author: DL @Description: 使用二分法查找mobil ...

  3. ASP.NET在主题中添加CSS文件

    ASP.NET在主题中添加CSS文件 在ASP.NET中,可以使用CSS来控制页面上HTML元素和ASP.NET控件的皮肤.如果在主题文件夹中添加了CSS文件,则在页面应用主题时也会自动应用CSS. ...

  4. CSS 字体(font)实例

    CSS 字体(font)实例CSS 字体属性定义文本的字体系列.大小.加粗.风格(如斜体)和变形(如小型大写字母).CSS 字体系列在 CSS 中,有两种不同类型的字体系列名称: 通用字体系列 - 拥 ...

  5. CSS系列:在HTML中引入CSS的方法

    HTML与CSS是两个作用不同的语言,它们同时对一个网页产生作用,因此必须将CSS与HTML链接在一起使用.在HTML中,引入CSS的方法主要有4种:行内式.内嵌式.导入式和链接式. 1. 行内式 行 ...

  6. JQuery中操作Css样式的方法

    JQuery中操作Css样式的方法//1.获取和设置样式 $("#tow").attr("class")获取ID为tow的class属性 $("#tw ...

  7. 如何在JAVA中实现一个固定最大size的hashMap

    如何在JAVA中实现一个固定最大size的hashMap 利用LinkedHashMap的removeEldestEntry方法,重载此方法使得这个map可以增长到最大size,之后每插入一条新的记录 ...

  8. 关于JAVA EE项目在WEB-INF目录下的jsp页面如何访问WebRoot中的CSS和JS文件

    找了这么久资料,总算解决了 感谢博客园:http://www.cnblogs.com/xsht/p/5275081.html 感谢百度:http://zhidao.baidu.com/link?url ...

  9. Flex中使用CSS控制页面样式

    Using file: Stylebounding.mxml Stylebounding2.mxml myCSS0329.css 在Flex4中使用CSS控制样式,既可以直接在MXML文件中写样式,也 ...

随机推荐

  1. python安装方法

    1.下载Python安装包 2.配置环境变量 path=%path%;C:\Python27 3.安装pip 默认已安装 4.配置pip环境变量 path=%path%;C:\Python27\Scr ...

  2. ORC Files

    ORC 全称是Optimized Row Columnar,意思是优化的RC file,优化行列式. ORC 文件格式提供了一个很高效的方式来存储hive数据.它旨在克服其他hive文件格式的限制.当 ...

  3. 性能调优之vmstat命令(转)

    vmstat是Virtual Meomory Statistics(虚拟内存统计)的缩写,可对操作系统的虚拟内存.进程.IO读写.CPU活动等进行监视.它是对系统的整体情况进行统计,不足之处是无法对某 ...

  4. LeetCode 100.相同的树(C++)

    给定两个二叉树,编写一个函数来检验它们是否相同. 如果两个树在结构上相同,并且节点具有相同的值,则认为它们是相同的. 示例 1: 输入: 1 1 / \ / \ 2 3 2 3 [1,2,3], [1 ...

  5. swift与OC混编之调用函数

    在桥接头文件里#import oc的.h文件,整个swift工程都能使用该oc文件,在.h里暴露的方法都能被该工程使用 //oc文件 TestOC.h #import @interface TestO ...

  6. html的列表

    1.无序列表(最常用) 先看个例子:如下图: 使用的 html标签为  <ul>   <!--ul是UnorderList的缩写,意为无序列表:li是ListItem的缩写,列表项- ...

  7. 深入理解JavaScript系列(45):代码复用模式(避免篇)

    介绍 任何编程都提出代码复用,否则话每次开发一个新程序或者写一个新功能都要全新编写的话,那就歇菜了,但是代码复用也是有好要坏,接下来的两篇文章我们将针对代码复用来进行讨论,第一篇文避免篇,指的是要尽量 ...

  8. maven配置编译器的版本

    发现每次启动idea时,项目里很多红色错误,都是的编译器版本不对,每次都要手动修改. 其实在pom里把默认编译器版本加进去就好了. <build> <plugins> < ...

  9. [转]JavaScript和html5 canvas生成圆形印章

    本文转自:http://www.cnblogs.com/dragondean/p/6013529.html 代码: function createSeal(id,company,name){ var ...

  10. MVC中FileResult 返回类型返回Excel

    公司中以前写的导出有问题.原来使用的XML格式字符串拼接然后转化成流输出 action public FileResult ExportJobFair() { try { string name = ...