先贴个网址:http://www.uml.org.cn/html/201207311.asp

大家可以参考一下面这张转换表(body字体为16px时的值)

总结

长篇介绍了一大堆,唯一想告诉大家的是以下几点

1、浏览器的默认字体大小是16px

2、如果元素自身没有设置字体大小,那么元素自身上的所有属性值如“boder、width、height、padding、margin、line-height”等值,我们都可以按下面的公式来计算

1 ÷ 父元素的font-size × 需要转换的像素值 = em值

3、这一种千万要慢慢理解,不然很容易与第二点混了。如果元素设置了字体大小,那么字体大小的转换依旧按第二条公式计算,也就是下面的:

1 ÷ 父元素的font-size × 需要转换的像素值 = em值

那么元素设置了字体大小,此元素的其他属性,如“border、width、height、padding、margin、line-height”计算就需要按照下面的公式来计算:

1 ÷ 元素自身的font-size × 需要转换的像素值 = em值

这样说,不知道大家理解了整明白了没有,如果没有整明白,可以回过头来看上面的一个实例。

   

jQuery mobile 前台设计中的css em的使用。的更多相关文章

  1. (转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明

    (原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll ...

  2. jQuery Mobile 移动开发中的日期插件Mobiscroll使用说明

    近期在移动方面的开发,使用jQuery Mobile ,移动方面的插件不如Web 方面的插件多,选择的更少,有一些需要自己去封装,但功力尚不足啊. 日期插件JQM也提供了内置的,但样式方面不好看,只好 ...

  3. VS前台设计中的缺陷

    程序的前台界面设计我一般都是Blend中完成的,因为在VS中前台比较难控制.而效果之内的就更不用说了.今天写了个小程序用来启动其他程序的.运行界面如下: 这是尺寸和距离刚刚好的,我们去Blend当中看 ...

  4. mobile webiste 中的css的font-size em及line-height等换算

    在mobile web设计 中,我们常常需要使用em这个字体大小的单位.em到底是多少呢? em到底应该设置为多少个em呢?通常换算成方法是1em=target fontsize we want/fo ...

  5. 使用Jquery Mobile设计Android通讯录

    本系列教程将指导大家一步步使用Jquery Mobile设计一个Android的通讯录应用.其中在应用的界面部分,将使用jQuery Mobile框架,并且会指导大家如何使Android中提供的web ...

  6. jQuery Mobile 手动显示ajax加载器,提示加载中...

    在使用jQuery Mobile开发时,有时候我们需要在请求ajax期间,显示加载提示框(例如:一个旋转图片+一个提示:加载中...).这个时候,我们可以手动显示jQuery Mobile的加载器,大 ...

  7. 学jQuery Mobile后的感想

    jQuery Mobile是jQuery 在手机上和平板设备上的版本.jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架.支持全球 ...

  8. jQuery Mobile 1.1八大新特性介绍

    随着HTML 5时代的来临,移动开发开始进入了一个新的时代,现在只需要懂得HTML5,配合一定的开发框架,就可以开发出十分漂亮的HTML5的移动应用.在众多的 移动HTML5开发框架中,比较著名的是j ...

  9. jQuery Mobile 和 Kendo UI 的比较(转)

    jQuery Mobile 和 Kendo UI 的比较 转自 https://www.oschina.net/translate/jquery-mobile-versus-kendo-ui?cmp ...

随机推荐

  1. 6*17点阵的Window程序, Java写的。

    package com.wulala; import java.awt.BorderLayout;import java.awt.Color;import java.awt.Dimension;imp ...

  2. Linux中文显示乱码解决

    输入 echo $LANG可以查看当前使用的系统语言 查看是否有中文语言包可以在终端输入 locale命令,如有zh cn 表示已经安装了中文语言 没有则 yum groupinstall chine ...

  3. java数组初始化

    java数组初始化 //静态初始化数组:方法一 String cats[] = new String[] { "Tom","Sam","Mimi&qu ...

  4. ORACLE添加表约束的语法示例

    转自:http://jingyan.baidu.com/article/f54ae2fccda68d1e93b84942.html 示例: --班级表 CREATE TABLE TCLASS( cl_ ...

  5. 学习JS中的小问题

    1.如果载入的2个js文件中有重名函数,那么调用的时候怎么分别调? 第二个文件载入无效. 2.checkbox jQuery对象的checked属性在选中时为checked,否则为undefined: ...

  6. cookie学习

    cookie是储存于访问者的计算机中的变量,每当同一台计算机通过浏览器请求某个页面时,就会发送这个cookie,可以使用javascript来创建和取回cookie的值. 创建和存储cookie 首先 ...

  7. 计算机学院大学生程序设计竞赛(2015’12)The Country List

    The Country List Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) ...

  8. c# Beginlnvoke 委托

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  9. shell脚本之if语句

    一.前言 结构化编程中,主要有三种结构:顺序.分支.循环.由此可见分支判断的重要性. 而且在shell编程中往往会遇到进行判断的情况,比如:判断文件是否存在.目录是否存在等等. 二.if语句的结构 i ...

  10. git status message - Your branch is ahead of origin/master by X commits

    git reset --hard origin/master git status FAQ: When I issue the "git status" command, I se ...