position: fix 没用?你大概是被 transform 坑了

在 CSS 里很多位置布局都是相对于容器的。但是 position: fixed; 比较直白,只相对于窗口,通常不会被干扰。但是我最近就遇到了这么个问题:

transform:scale(1);
position:fixed; right:10px; bottom:10px;

这不对呀,我明明写的是 position: fixed; 为啥没用呢?

于是我一个一个翻看父元素的 CSS 布局属性,发现一个 Modal 库有个奇怪的 transform: scale(1); 。这个属性没有任何视觉的效果,显然是动画执行之后留下的。然而在技术实现上,即使是 scale(1)translateX(0) 这种没有任何效果的 transform ,也会重建一个坐标系,导致内部元素的 position:fixed 不再相对于窗口,而是相对于这个 transform 元素。

这是不是某个浏览器实现的缺陷呢?实际测试 Firefox 和 Chrome 都是一样的效果。这也许是一个 Web 标准中比较含糊的灰色区域。

解决方法比较简单粗暴,把 transform: scale(1) 改成 transform: unset 即可。在实践中,尽量避免对比较大的容器使用 transform,比如 Sidebar 和 Modal。如果要用的话,则要确保子元素不会用到 position: fixed,比如一些 Popup。

Web 内嵌字体格式

简而言之,WOFF2 是你唯一需要的字体格式。如果你需要支持 IE11,那么就加上 WOFF 作为备用字体格式。

@font-face {
  font-family: 'Source Code Pro';
  font-weight: 400;
  font-style: normal;
  src: local('Source Code Pro'),
    url('source-code-pro-regular.woff2') format('woff2');
}
继续阅读 →

永久居留许可可被撤销

简而言之:即使拿到永久居留许可,在你离开芬兰超过两年后都会被撤销。

永久居留许可(Permanent Residence Permit)并不是永久性的,它在某些条件下会被取消。根据半官方的 InfoFinland 网站介绍:

当您永久移居至国外,不间断居住满两年,或在申请永久居留许可时提供了不真实信息,永久居留许可可被取消。

InfoFinland

即使你打算大部分时间在国内生活,也必须每隔一年多回芬兰一次,以保证永久居留许可不被取消。

那么,在芬兰待多长时间算是有效的回芬兰呢?一天?一个月?一年?这个我也不太清楚,打算问一下移民局。

芬兰电子身份认证

当你在芬兰居住并注册社保号(Social Security Number)之后,各个公共系统里就已经自动为你创建了账号。这些系统包括:移民局系统,警察局系统,医疗系统,税务系统,社保系统(Kela),邮政系统(Posti)等。这些系统都有网络服务,但是你需要特殊的电子身份认证(e-Idenfication)才能注册使用。

先决条件

必要的条件是:

  1. 居留许可,且居留许可不能快要过期。
  2. 在当地警察局注册了社保号。
  3. 有芬兰本地的手机号码或银行账号,取决于你是要办理哪种。

一个存疑的条件是芬兰身份证。身份证是每个人都可以去居住地所属警察局办的(比如你住 Espoo,就必须去 Espoo 警察局),有些地方会要求这个证件才给你办理业务,但也有很多不用。尤其是办电子身份认证。有的银行网点就非要这个身份证才给办,我的一个学妹去了好几次都不给办。但是也有的地方就不需要,比如我去 Sello 的 Nordea 办的时候,她并没有特别要求身份证,我只是说我没有,但是又急着用。

银行身份认证

需要去你的开户银行办理。

银行的身份认证我觉得更有用,也更安全可靠。银行员工都会仔细核实你的身份信息,银行的动态密保 APP 也更加可靠。

如果银行工作人员要求必须要有身份证,可以换一个银行网点问问。如果都要身份证,那你可以去居住地警察局办一个。

使用方法和登录网银没有什么区别。在认证页面选择你开户的银行,然后跳转到网银登录页面,使用动态密保 APP 登录。

手机身份认证

需要去你的手机运营商办理。

据我个人模糊的感觉,手机运营商的员工通常业务都不太熟练,办事也不太靠谱。

手机运营商有个不成文的限制:你必须要在芬兰住满两年以上,他们才给你办理后付费卡(Post-Paid)和电子身份认证。新生就不要考虑了。

如果你的手机卡是预付费卡(Pre-Paid),说明它没有与你的身份信息绑定。而如果你要绑定身份,则需要把买卡的时候那张完整的卡片带来,上面有 PIN 和 PUK 码。不然就只能换新手机号了。

Arabia 姆明系列

姆明 Moomin 系列卡通形象可以说是芬兰输出全球最多的文化符号了。衍生周边产品众多,各个年龄段的人都喜欢,非常适合送礼物或自家用。

继续阅读 →

比较 HTML 和 JavaScript Input 验证

如果你想验证表单输入是否有效,比如你想让输入框只接受整数,而不是小数或文字,在 HTML5 中你可以用以下代码轻松实现:

<input type="number" pattern="[0-9]*" />

但是,用户仍然可以输入无效信息:

  1. 在 Firefox 里,你可以输入任何字符:比如“fsielfs”。
  2. 在 Chrome 里,你可以输入一些无效的数字:比如“1..2.2.2”。
继续阅读 →

芬兰住宅保险

居住在 HOAS 和 AYY 的学生房的同学是不需要住宅保险 Home Insurance 的,可以暂时先不用看这篇文章了。如果毕业准备找房,可以一看。

继续阅读 →

芬兰税卡详解

每年新年前后,在芬兰的同学们都会收到一封来自 VERO (芬兰税务局)的信。这封信里面就是税卡以及税率的解释。很多同学都有疑问:

  1. 为什么我没有收入还会收到税卡?
  2. 为什么我的税率和别人的不一样?
  3. 为什么我的税率这么高?
  4. 为什么我的税率额这么高?

这篇文章将解答这些问题。

继续阅读 →