一、前言

在CSS样式中,当文本缩放的时候使用font-size属性是最难以理解的方面之一。在CSS中,你有4种不同的选择,能够让你设置文本在浏览器中的展示。那么这4种单位哪一种更适合呢?这个问题引发了各种各样不同的争论和评价。想要找到一个比较权威的回答可能比较困难,因为这个问题比较难回答。

PS: 半年前只翻译啦一半,半夜打开一看原文突然就想把剩下的翻译啦~里面有一些自己的观点描述,如果有错误请您留言给我,一定修正。

二、合适的单位

"Ems"(em): "em"是被用于网页文件媒介的可缩放的单位(即相对单位)。1em就等于当前字体的大小,举个例子来讲,如果文档中字体的大小为12pt,那么1em = 12pt。Ems拥有能够缩放的特点,所以2em = 24pt,0.5em = 6pt(你也可以使用原文中的.5em,但是我觉得0.5em的可读性更好)等等。

Pixels(px): 像素是被用于屏幕媒介(在计算机屏幕上读取)的固定大小的单位(即绝对单位)。1像素表示电脑屏幕中的1个点(这是你的屏幕能够识别的最小单位)。在设计网页的时候,很多web设计者采用像素,因为它能够很精确的在浏览器中渲染网页。但是,使用像素作为单位,当近视的用户(或者视力不好的用户)放大正在浏览的网页或者在移动端缩小网页到合适的尺寸,都会呈现一些问题。

Points(pt): Points是一直以来被用于打印媒介(打印在纸上等等)。1pt = 1/72英寸。Points和Pixels比较像,它们都是固定大小和不能缩放的单位。

Percent(%): 百分比单位和"em"单位很像,但是存在着细微的不同。首先也是最重要的不同,就是在font-size = 100%(比如:12pt = 100%)的时候。当使用百分比单位,你的文本完全能在移动端正常访问。

- 阅读剩余部分 -

一、技术嘉年华

2014年3月5日来到公司,下午开始第一天的工作,感觉公司的技术氛围不错。今天,第一次参加公司的技术嘉年华,感觉这是一片技术的海洋,有很多技术大拿,也有很多实战大神!

海报

这个海报感觉还比较喜庆,感觉有点玩中国风,嘿嘿!

- 阅读剩余部分 -

前言

因为 Arial, Verdana, Garamond or Times New Roman 这些字体几乎在所有电脑上都有安装,所以以前每个网站都使用他们来渲染文本。至今,虽然webfonts已经在互联网中得到普遍的使用,但是我们依然不知道如何高效的加载他们。

为了提供更好的用户体验,我写了一些怎么做才能高效加载webfonts的简单解决方法,这个方案的实施并不需要昂贵的硬件支持。

0. 目录

主要从以下方案进行介绍:

(1)使用woff字体格式(PS:可能是EOT和TTF格式默认情况下不会进行压缩,然而WOFF格式具有内建压缩,而且WOFF格式的支持很广泛的原因。);

(2)对于不支持webfonts的浏览器使用“web安全”字体(PS:使用前言中提到的一些几乎所有电脑都安装了的字体作为后备字体,保证用户能够正常浏览网页);

(3)下载字体的“二进制”格式,并且优化它;

(4)使用你自己的字体库;

(5)将字体进行base64编码后,存放于CSS文件中;

(6)如果用户本地没有网页请求的字体,那么就异步加载该字体,并且将该字体存储在localStorage中,以便第二次请求字体直接从localStorage中进行读取,避免字体加载带来的性能问题;

- 阅读剩余部分 -

路程:来回110公里

时间:2014年9月20日

我、智杰、成银、肆爷、文武、文成、孟孟(7人)


1. 景点简介

雁栖湖,是位于北京市怀柔区北部北台上村的水库,拦截雁栖河,北临雄伟的万里长城,南偎一望无际的华北平原。雁栖湖水面宽阔,湖水清澈,每年春秋两季常有成群的大雁来湖中栖息,故而得名。

2. 出发前的集合

跟之前约好的一样,早上9点到公司集合出发。大家像打了鸡血一样吃完了早餐,摆好了出发的架势准备出发,在出发前文成比较有经验,还教我们一些骑行中要用到的常用手势,感觉很专业的样子^0^

- 阅读剩余部分 -