Day5 金魚 綜合練習#1 簡單小語 這次的練習發現許多細節在初學時沒有注意好，例如空間的配置以及padding及margin的應用，如何讓版面排起來增加可...
Day4 金魚 稀飯版+蓋版廣告 簡單小語 這次多練習了偽元素before跟after，還記得當初看到Amos老師用這個功能，真的是一頭霧水看不懂，也很好奇這...
Day3 金魚 稀飯版 簡單小語 依稀記得當初看到Amos老師說稀飯版就是吃飯一樣簡單，那時的我真覺得太扯了，要切出那樣的版面居然說是簡單，到這次刻意練習時發...
Day2 金魚 相對絕對定位 簡單小語 定位的重要性不可言喻，一招可以有各種變化，釐清relative，absolute，fixed之間的差異及使用時機，套句...
Day1 學習前端的起源 起源 小魯今年28歲，從事FAE及技術支援類工作約3年，資訊系畢業但沒去寫程式，當初也不愛寫程式。 2020年COVID-19疫...
繼上次的 ESLint 後，這次要來介紹的是 StyleLint，那就廢話不多說開始吧！ StyleLint StyleLint 一個檢查 CSS Coding...
React兩種使用CSS方法 一、在檔案中寫寫css的第一個作法 Header.js import React from "react";...
以下要分享一些從金魚腦切版中及自己在切版過程中學到的一些知識點。 https://ithelp.ithome.com.tw/users/20112550/iro...
由於 video 是 HTML 內置組建，不能通過強制改變 size 使 video 鋪滿元素。如果要實現 video 全屏效果就需要用到 CSS 的 obje...
話不多說,先上成果! 思考迴路: 撰寫keyframes使每個點上下移動(transform),我們命名這個keyframe為waving 每個點都具備相同...
今天要來介紹一個比較不常用的東西，那就是 CSS 中的列印，在以前常常會將網頁列印出來，所以經常會使用到這個屬性，時到今日，使用的時機越來越少，只有一些報表有用...
Sass/Scss是一個非常好用的預處理器，所謂預處理器，就是可以在我們轉變成CSS之前，更有結構性寫、簡潔、清晰且好維護的 CSS 程式碼，在大型專案中可說是...
Gird 是一種 CSS 的網格系統，他出來也有一陣子了，直到最近突然想到我還沒認真看過XD，所以想說該來還債拉，這篇就跟大一起來學習一下如何使用 Gird，那...
什麼是 Bootstrap 4 Bootstrap 是一種由 HTML、CSS 和 JavaScript 寫成的前端框架，可以更快更方便的開發網站Bootstr...
又過了一週啦~一樣是超忙的一週~~下班回家努力練習切版直播的作業，不過這次的版型比較複雜所以卡關了QQ真的是燒腦燒到一個極點這次的作業除了 PC 版之外，還需練...
以下為原始檔 https://github.com/87JoJo/02---JS-and-CSS-Clock 這次的練習，是要做一個小時鐘，而重點在於CSS的撰...
從別人的部落格(轉職歷程)領悟到學習應不疾不徐 今天分享筆記之外的心境，最近因為開始工作，在學習的時間變的比較無法自由掌握。因此學習有些緩慢下來!! 那為什...
今天也來分享一下，自己昨天從AMOS大大的直播，所學到的CSS grid知識，有誤的地方，歡迎指證並還請見諒，謝謝! CSS Grid有點線面的概念，可以應用在...
Hi~大家這周過的好嗎? 上週開始參加六角學院切版直播班，希望讓自已的切版能力越來越好但現在的程度還算是很新~所以希望能把在這八週學到的寫成筆記更加深印象~這週...
Hi~~大家這週的過的好嗎?現在最好防疫就是待在家別亂跑吧~當然我也好好待在家好好寫文啦~雖然好燒腦(大誤XDD上星期介紹完 CSS 的基本語法後，今天來寫寫...
大家好啊~~又見面惹~ 不知道清明連假大家有沒有乖乖待在家防疫還是有出遠門走走呢? 四天連假只待在離家不遠的地方走走運動，其餘時間就是待在家休息 感覺待在家才是...
團隊介紹 均一平台教育基金會（Junyi Academy Foundation，簡稱均一）是一個致力於「讓每一位孩子都有機會成為終身學習者」的非營利組織。 我們...
切版練習日期: 2020/02/14觀看影片 : CssCoke - "金魚都能懂的網頁切版 : 網頁頁尾版塊 NO006" &&a...
暨上一篇學習遇到低潮期，搜尋網友的#技術文章分享 在iT邦幫忙，發現這篇「金魚都能懂網頁設計入門」 Amos 老師分享的技術文，說到筆記學習方法 「XMind」...
2020/02/12 觀看CssCoke大大的Youtube金魚也懂的網也切版，"金魚都能懂的網頁切版 : 超通用橫式版面 NO005"跟著...
我們需要您具備以下能力：1、從事前端開發2年及以上，精通各種前端技術，包括HTML/CSS/JavaScript/Node.JS等2、具備跨終端的前端開發能力，...
概念: 1.先用linear-gradient 在background 做出漸層效果 background: -webkit-linear-gradien...
第一種:border 解說:利用中間欄位的border-left與border-right來實現視覺上的等高效果，但缺點很明顯:「左右兩邊內容超出中間欄位時，會...
有時要把陰影調整得非常 “Smooth 順滑” 是一件不輕鬆的事情，如果沒有受過正規的學術訓練，尤其容易弄巧成難看的陰影，雖然這非常主觀，但不妨多參考國外的優...
前情提要：讓我們站在巨人的肩膀上，如何在專案中導入 Bootstrap 4 並客製它 ★首先這篇文章適合以下背景的人閱讀： 熟悉 HTML、CSS 知道如何...
TerryYu
Alec
iThome鐵人賽
看影片追技術