✏️前端基礎
10 個實用卻冷門的 HTML 技巧
前端基礎-雖然 HTML 學起來很簡單，但卻有很多實用的技巧被忽略，這些技巧可以讓你更輕鬆地實現特定的功能和效果。 今天介紹 10 個你可能不熟悉，但非常有用的 HTML 標籤及其應用示例，分別是： <de...
前往10 個實用卻冷門的 HTML 技巧文章深入解析 CSS z-index 和 stacking context 堆疊上下文
前端基礎-你有發生過設定 z-index: 999 的元素蓋不過 z-index: 0 的元素嗎，今天我通過這篇文，帶你清楚了解 z-index 以及瀏覽器的元素先後比較機制。 z-index 是什麼 z-...
前往深入解析 CSS z-index 和 stacking context 堆疊上下文文章HTML img 標籤的三個實用方法
前端基礎-限制圖片大小 如果我們用 width: 100%，圖片會跟著父元素的寬度，當父元素越大，圖片也會變大，如下👇 有時候我們希望圖片的大小不要超過原始尺寸，此時就可以用 max-width: 100...
前往HTML img 標籤的三個實用方法文章5 種你一定要會的 CSS 選擇器 - 大幅減少 JS 的使用，製作網頁更有效率
前端基礎-相信 CSS 選擇器對寫網頁的人都不陌生，除了常用的 :hover、:actived、::after 之外，還有其它超很好用的 CSS 選擇器，用的好的話甚至可以取代部份的 JS 程式碼，今天我就整理...
前往5 種你一定要會的 CSS 選擇器 - 大幅減少 JS 的使用，製作網頁更有效率文章為甚麼你寫的 CSS 沒有效果 - CSS 選擇器的優先級、權重
前端基礎-為甚麼你寫的 CSS 沒有效生效呢？ 在 CSS 中優先級可以分成 0 ~ 5 共 6 個等級，數字越大，優先級越大，比如說 !important 就是 5 級優先級，所以他可以覆蓋所有的選擇器。 ...
前往為甚麼你寫的 CSS 沒有效果 - CSS 選擇器的優先級、權重文章JS 事件 Event 詳解 - JS 和 HTML 之間的交互動作 (addEventListener、冒泡、捕獲)
前端基礎-JavaScript 和 HTML 之間的交互動作是靠事件 Event 實現的。當文檔或瀏覽器發生一些用戶行為的瞬間(例如點擊、滾動、縮小放大視窗…等等)，可以利用監聽器 Listener 來監聽並執...
前往JS 事件 Event 詳解 - JS 和 HTML 之間的交互動作 (addEventListener、冒泡、捕獲)文章JavaScript 的重要觀念 - Event loop 事件循環詳解
前端基礎-甚麼是 Event loop 當我們在瀏覽器中執行 JS 時，通常會遇到一些需要時間來完成的任務，例如向服務器請求數據。這些任務可能需要花費很長時間來完成，但是我們又不能讓 JS 的執行停頓下來，導...
前往JavaScript 的重要觀念 - Event loop 事件循環詳解文章JavaScript 的 async / await 到底在幹嘛？前端非同步的簡潔寫法。
前端基礎-甚麼是非同步函數 async / await saync / await 是 ES8 新增的語法，它允許我們以同步的方式編寫非同步程式碼，讓我們更容易地管理非同步操作，編寫出更清晰、簡潔、易讀的程式...
前往JavaScript 的 async / await 到底在幹嘛？前端非同步的簡潔寫法。文章前端重要觀念 Promise - 為甚麼要有 Promise？如何使用？
前端基礎-到底甚麼是 Promise？ 用一句話說，Promise 是一個對 還未有結果的事物 的一個替身，且他不是前端才有的東西。 那為甚麼要對未有結果的事物做一個替身呢？ 這篇文有提到，我們不知道非同...
前往前端重要觀念 Promise - 為甚麼要有 Promise？如何使用？文章