iT邦幫忙

網頁前端相關文章
共有 112 則文章
鐵人賽 Modern Web DAY 4

技術 Day 04 HTML/JavaScript Attribute vs Property

Attribute vs Property attribute:屬性在 HTML 會被稱為 attribute,href is attribute of a。...

鐵人賽 Modern Web DAY 3

技術 Day 03 HTML/CSS 使用 tailwindcss 遇到的小問題

tailwindcss 是新世代的框架,常常拿來跟 Bootstrap 比較套句老師上課說的話,單純比較框架之間的好壞是沒有意義的只要評估你現在做的專案適合哪個...

鐵人賽 Modern Web DAY 2

技術 Day 02 HTML/CSS 點擊超連結會經歷的偽類選取器(Pseudo-classes)

根據 MDN,目前 CSS 的偽類選取器有以下這些: 今天要介紹到的是關於點擊超連結後會經歷的五種偽類選取器(紅框內): 在 style 裡面可以用 a:li...

鐵人賽 Modern Web DAY 1

技術 Day 01 阿修補坑中

第一天先來聊聊我的背景以及為什麼我會想寫這個主題 原本我是一名品保工程師,做了3、4年發現這份工作開始不符合我的需求,所以想轉換跑道。而人生要挑戰才算好玩(By...

鐵人賽 自我挑戰組 DAY 1
開始入坑網頁吧! 系列 第 1

技術 重新學習JavaScript#JavaScript能做甚麼?

JavaScript (簡稱JS)是一種物件導向的程式語言 "object orient programming language",也是最...

鐵人賽 Modern Web DAY 14
33歲轉職者的前端筆記 系列 第 14

技術 33歲轉職者的前端筆記-DAY 14 排版技巧小筆記-標籤屬性元素及定位方法

區塊元素(block) 預設為區塊元素的標籤有:h1~h6,p,div,section,header,nav等等… 會造成「換行的標籤(元素)」 可以設定「w...

鐵人賽 自我挑戰組 DAY 7

技術 Day 07 CSS <字體屬性>

CSS Fonts(字體) 屬性用於定義字體系列、大小、粗細 和文字樣式(ex:斜體) 1.字體系列font-family 屬性定義文本的字體系列 &lt;st...

鐵人賽 Modern Web DAY 1

技術 33歲轉職者的前端筆記-DAY 1 前言

這是第一次參加鐵人賽 原本是想要在轉職期間來挑戰寫個 30天 的學習筆記 但在開賽前找到相關接案工作啦~ 算是轉職成功了! 目前是兼職接案 雖然規模沒有很大但合...

技術 React和DOM的那些事-節點新增算法

點擊進入React源碼調試倉庫。 本篇是詳細解讀React DOM操作的第二篇文章,文章所講的內容發生在commit階段。 插入DOM節點操作的是fiber節點...

技術 完全理解React的completeWork以及错误边界

點擊進入React源碼調試倉庫。 概述 每個fiber節點在更新時都會經歷兩個階段:beginWork和completeWork。在Diff之後(詳見深入理解R...

技術 [鼠年全馬鐵人挑戰] Week09 - 超新手入門:CSS 的基本語法

大家好啊~~又見面惹~ 不知道清明連假大家有沒有乖乖待在家防疫還是有出遠門走走呢? 四天連假只待在離家不遠的地方走走運動,其餘時間就是待在家休息 感覺待在家才是...

技術 [鼠年全馬鐵人挑戰] Week07 - 新手學習筆記: RWD 基礎語法

Hi~又見面啦 今天來學習一下 RWD 的基礎小語法,希望可以學習練習的過中程能熟能生巧呀 想要讓原本在桌上型電腦能看的網頁加上 RWD 自適應網站功能時需先加...

技術 [鼠年全馬鐵人挑戰] Week06 - 新手學習筆記:淺談 RWD (響應式網頁設計)

Hi~又見面啦 這週大家過的好嗎? 最近開始學習了 RWD 響應式網頁設計,發現可以運用的好多也不少細節呢~想好好把學到的寫成筆記增加自已的印象 :)所以最近幾...

技術 [鼠年全馬鐵人挑戰] Week02 - 超新手小知識:HTML、CSS、JavaScript的關連性

Hi~大家 我們又見面啦:)上星期那篇文章出乎我的意料的有很多人關注真的嚇歪我啦XDDD謝謝大家對於我這個剛碰程式的新手小嫩嫩那麼大的支持呀~讓我有更多的動力去...

技術 [鼠年全馬鐵人挑戰] Week01 - 非本科系零經驗超新手前端之路

在接觸程式前在我的基本認知裡覺得程式碼真的是一個非常複雜的東西呀這要本科系又是頭腦很好的神人才有辦法寫的吧XD所以壓根沒想到之後的我會開始學習程式 至於 為何會...

技術 新手學前端-JavaScript:資訊如何帶進去的語法

Html語法: &lt; p &gt;這一顆紅豆餅是&lt; em id=&quot;price&quot;&gt;&lt; /em &gt;元 &lt; /...

鐵人賽 Modern Web DAY 24
鉄人28号FX 系列 第 24

技術 鉄人28号FX 鉄人24号「影隨者」text-shadow

★ 地圖雷奧鎮市中心 ↓↓↓ 顯示雷奧鎮街上位置圖 街上好不熱鬧,隨處閒晃著。(竹輪也太美味! 呵 ) 真想再吃?! 怪? 從剛就??? (揉眼睛。) :到底怎...

技術 第三十三步 -神秘的箱子 (Javascript 物件部分)

大家早安,又到了周末,我是喵橘,今天我要報告的是 Javascript 物件部分。 何謂物件? Javascript 是一個物件導向的程式語言設計,但跟其他物件...

技術 第三十二步 - 創造自己的風格(Javascript 函式部分)

大家好,我是喵橘,一轉眼又到了星期四,今天我要報告的是 Javascript 函式部分。 何謂函式? 發現 Javascript 練習到現在,程式碼的內容越來越...

鐵人賽 Modern Web DAY 18
鉄人28号FX 系列 第 18

技術 鉄人28号FX 鉄人18号「左右蛙」text-align, text-align-last

★ 地圖西北方峽谷森林 ↓↓↓ 顯示峽谷森林位置圖 睡前數羊數著數著……天就亮了。 眼前好美啊! 痾?? ) 峽谷瀑布 [左右蛙]: 為什麼總是一再找麻煩? 你...

技術 第三十一步 - 遇到返回鏡子突襲! (Javascript控制語法)

大家好,我是喵橘,今天我要報告Javascript控制語法部分,今天是新的開始。 流程控制 看到流程控制,讓我想起一個笑話,我就說給大家聽: 有一天,一位是擔任...

鐵人賽 自我挑戰組 DAY 30

技術 第三十步- 這不是最後一天,而是新的開始(Javascript 運算子)

大家好,我是喵橘,雖然今天是最後一天,但我還會繼續發文,但就限平時的時間,假日的時間我會去檢查之前的發文來做多次修改,許多部份可以進行補充與改正,是之後發文的方...

鐵人賽 自我挑戰組 DAY 29

技術 第二十九步 - 第三層各陷阱挑戰( JavaScript 資料類型)

各位大家好,我是喵橘,今天是颱風天,雖然南部並沒有明顯風雨,但貼心叮嚀北部朋友,越晚風雨越大,盡量不要隨便出外,避免有生命危險。 資料類型 在寫程式裡,不同的...

鐵人賽 自我挑戰組 DAY 28

技術 第二十八步 - 宣告第三關破解方法(JavaScript 變數)

大家好,我是喵橘,今天是一個悶熱的星期日,我要報告 JavaScript 變數的部分。 JavaScript 變數 何謂變數? 變數就可以比喻可以一個放入東西的...

鐵人賽 自我挑戰組 DAY 26

技術 第二十六步 - 最後破關的條件(CSS總整理)

大家好,我是喵橘,今天我要總整理一下 CSS 的相關知識,並且,補充之前沒有說明到的部分。 區塊陰影設定 想要讓一個區塊或物體更加生動,就可以添加陰影效果,假如...

鐵人賽 自我挑戰組 DAY 25

技術 第二十五步 - 過去與未來的未來關鍵(CSS 動畫部分)

大家早安,我是喵橘,今天要報告的 CSS 動畫部分,今天也請各位多多指教喔~ 動畫關鍵影格設定 動畫的呈現就是由一個一個的關鍵影格所組合而成,所以,在設定動畫之...

鐵人賽 自我挑戰組 DAY 24

技術 第二十四步 - 變形的未知走道(CSS 變形設定)

大家早安,我是喵橘,今天我要報告的是 CSS 變形的各種效果。 形狀變形 transform 屬性功能是設定各種幾何的變化,能設定的值如下表所顯示: 設定...

鐵人賽 自我挑戰組 DAY 23

技術 第二十三步 - 位置變換術(CSS 版面定位設定)

大家好,我是喵橘,今天要報告的是 CSS 版面定位設定,請大家多多指教。 float 屬性 它能隨著圖片進行文繞圖的動作,是屬於浮動元素的一種類型,所以,在定位...

鐵人賽 自我挑戰組 DAY 22

技術 第二十二步 - 神奇的機關盒(CSS盒子模型設定)

大家好,我是喵橘,今天我要報告的是在版面上一個個盒子模型的不同設計方法。 何謂元素? 前面章節有簡單敘述元素的使用方法,在 CSS 裡它把每一個 HTML 標籤...

鐵人賽 自我挑戰組 DAY 20

技術 第二十步 - 欺騙的幻覺背景(CSS 背景)

星期六假日,我是喵橘,先開心去看電影...咦?晚點再講解 CSS 背景部分。 CSS 背景 背景色彩設定 網頁除了文字的變化,也別忘記背景也能做設計,顏色調整...