次世代 Hugo

使用 Nullish Coalescing Operator 判斷 Nill

ECMAScript 2020 支援了 ?? Nullish Coalescing Operator，至此 ECMAScript 終於有專屬的 Operator 判斷 null 與 undefined，不必再借用 || 與 Falsy Value。

2020-12-21

replace() 可取代 String，搭配 Regular Expression /g 可一次取代所有 String。

2020-12-19

Box Model 預設將 width 與 height 設定在 Content Box，但你可以透過 box-sizing 將 width 與 height 設定在 Border Box。

2020-12-15

CSS 有獨特的 Box Model，除了包含本身的 Content Box 外，尚包含 Border Box、Padding Box 與 Margin Box，其中 DevTools 的寬度計算只包含 Width、Border 與 Padding，並不包含 Margin。

2020-12-15

當圖片放在 Block 中，會發現圖片似乎與 Item 底部有些空隙，這是因為 <img> 本身 vertical-align 預設值為 baseline 所造成。

2020-12-14

Radio 必須點到 方框 才能選取，實務上會想要點擊 Label 也相當於選擇 Radio，可將 <input> 與 <label> 合作達成。

2020-12-13

HTML 的 input(type='file') 預設只能選擇檔案，若要選擇目錄，則要使用 WebKit 特殊支援。

2020-12-11

WebStorm 已經內建 Emmet 與 Lorem，但卻沒內建 Fakeimg，但我們可自行建立 Code Snippet。

2020-12-11

<li> 在文字前面預設可顯示圓形或方形，使用 before 可改變 <li> 所顯示圖形。

2020-12-09

當 <a> 並排時常發現之間會有一點空間，此乃因 <a> 為 Inline Element，會將其後的多個 space 視為一個 space 保留顯示。

2020-12-07