風の迷路。

07-01-2019 更新

似乎有部分人在查找蘋方體(PingFang)的下載點? 找了找發現apple官網又真的沒有下載點，網上的下載點會不會加甚麼病毒就不知道了…這邊還是請大家小心一點。

iOS 預設字型

iOS 9 前

繁體: 黑體-繁 (Heiti TC)

• STHeitiTC Light (幼體)

• STHeitiTC Medium (黑體)

簡體: 黑體-簡 (Heiti SC)

• STHeitiSC Light (幼體)

• STHeitiSC Medium (黑體)

英文: Helvetica Neue

Jekyll

Jekyll是使用Ruby開發的靜態網站生產器，可以存放在Github裡，現在這個Blog也是使用Jekyll的。因為每一次洗機後在Windows安裝Jekyll總是會遇到錯誤，還是記錄一下步驟好了。

最近在facebook裡看到了這個免費的課程 - Chrome 網頁除錯功能大解密。前幾天很快地看過一次，節錄一下自己還不知道的技巧。

See the Pen CSS - Close Button by Molly Kan (@mollykannn) on CodePen.

HTML

<div class="sample-1">
  <span class="sample-1-close"></span>
</div>
<div class="sample-2">
  <div class="sample-2-close">
    <div class="sample-2-close--left"></div>
    <div class="sample-2-close--right"></div>
  </div>
</div>

CSS

.sample-1-close {
  position: absolute;
  cursor: pointer;
  color: #fff;
  font-size: 50px;
  font-family: Arial,sans-serif;
  border-radius: 50px;
  background: #605F61;
  line-height: 0px;
  padding: 23px 9px 23px 9px;  
}

.sample-1-close:before {
  content: "\00d7";
}

.sample-2-close {
  position:relative;
  cursor: pointer;
  top:0;
  left:0;
  width:50px;
  height:50px;
}

.sample-2-close--left, .sample-2-close--right {
  position:absolute;
  width: 0;
  top: 22px;
  left: 9px;
  height: 5px;
  border-style:solid;
  border-width:0 0 0 30px;  
}

.sample-2-close--left {
  border-color:#000;
  transform: rotate(45deg);
}

.sample-2-close--right {
  border-color:#000;
  transform: rotate(-45deg);
}

_trackEvent(category, action, opt_label, opt_value, opt_noninteraction)