iT邦幫忙

前端新手村相關文章
共有 116 則文章

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

Html語法: < p >這一顆紅豆餅是< em id="price">< /em >元 < /...

鐵人賽 自我挑戰組 DAY 1

技術 新手村01 - JavaScript Drum Kit

01 - JavaScript Drum Kit 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? smal...

鐵人賽 Modern Web DAY 4
實作經典 JavaScript 30 系列 第 4

技術 Day04:用CSS + JS 做一個時鐘

WES BOS系列影片 Alex快速導讀系列影片 原作者的時鐘版本比較簡易些,對於時間的算式也比較不直覺, 而Alex大大的版本將時鐘做得更細緻,時間算式也更完...

技術 鼠年全馬鐵人挑戰 WEEK 09: 月亮圓又圓,用 border-radius 讓你圓又圓

雖然離中秋節還很遠, 已經想烤肉了XD ,但每次抬頭仰望星空,看到月亮一點一滴的變化, 讓我心中掀起小波瀾,心中思考著要如何讓月亮長存,而不是只有黑夜。 如何使...

技術 鼠年全馬鐵人挑戰 WEEK 10: 這時我看見他的背影,我的淚很快地流下來了。 box-shadow

還記得國中時,老師國文課時上到朱自清-背影, 雖然內容不多,但內容卻十分豐富,國中時我還是位懵懂的少年,不經世事的孩子, 對文章的真情未必有深入的感受及透澈。僅...

技術 鼠年全馬鐵人挑戰 WEEK 17: CSS transform

transform:(動作的函數),通常會配合animation或:hover來做些動畫效果 範例 transform-origin:x y; 指定動作的參考點...

技術 鼠年全馬鐵人挑戰 WEEK 13: CSS | 假的!假的!這一切都是假的!偽元素 - 基本用法

什麼是偽元素? 它不是網頁元素,但行為、表現又像元素一樣,可以用CSS操控。 簡易來說它就是個分身術,常用的偽元素有::before、::after兩種。 ::...

技術 鼠年全馬鐵人挑戰 WEEK 12: 提升切版速度!Emmet原來可以這樣用!

最近參加了六角學院的切版班,想要提升自己的切版速度,分享幾個我常用的方式。 如果有更好或覺得不錯的方法,可以留言分享喔! 需要你們打開我的新世界 基本用法 !=...

技術 鼠年全馬鐵人挑戰 WEEK 25: Git branch 合併 Merge Rebase

分支 在開發中我們會有許多版本,像是開發版、測試版,測試功能都正常,才會合併到上線版。 分支就像是影分身術的概念,而我們會透過 git的指令,來取需要分身的部...

技術 [鼠年全馬鐵人挑戰] Week22 - 超新手學前端 - JavaScript 使用時機

學了一陣子的JavaScript遇到了不少問題 其中遇到一個最大的問題是 學了那麼多語法要怎麼運用? 我知道函式、物件、陣列但我不知道什麼時候該用哪個? 不知道...

技術 2021 春季 JS 直播班心得

前言 去年忙結婚的事情一度暫停學習及更新文章 忙完結婚事以後剛好六角學院也開了很適合新手的JS直播課程 自已實在是停了太久所以就立馬報名啦! 在上課之前的心理...

鐵人賽 Modern Web DAY 1

技術 《For 前端小幼苗的圖解筆記》參賽宣言

首次挑戰鐵人賽,不囉嗦,首發直接上目錄&自我介紹! 《For 前端小幼苗的圖解筆記》 Day About Subject 01 Autor 關於《...

技術 [鼠年全馬鐵人挑戰] Week18 - 超新手學前端 - HTML table 小概念

又過了一周啦~ 最近開始學習如何用 table 排版,在學習的過程中順手記下筆記讓自已更有概念:) 何謂table table 是在 HTML 排版的一種方式,...

技術 鼠年全馬鐵人挑戰 WEEK 14: 我想亮白、我想復古、我想___?CSS filter

CSS filter簡單來說就是濾鏡功能,以下整理幾個常用的功能。 1.blur模糊(px) 越大越模糊,如果想要朦朧美就參考這個吧! filter:blur...

技術 [鼠年全馬鐵人挑戰] Week27 - JavaScript 練習題- 比較運算子

這周來練習比較運算子,也是我不太熟練的一個章節 要好好努力練習了~ 題目 請觀看以下文章後,解答以下題目: [JS] 判斷筆記 比較運算子 重新認識 JavaS...

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

技術 鉄人28号FX 鉄人26号「路徑鳥」SVG <path> <textPath> <defs>

★ 地圖雷奧鎮市中心 ↓↓↓ 傳送卷軸,建議先向 鉄人25号「圖形鹿」獲得幫助,此為雷奧鎮續文。 顯示雷奧鎮街上位置圖 :這簡直就像是一直合理存在著。 雷奧鎮小...

鐵人賽 自我挑戰組 DAY 26

技術 新手村26 - Stripe Follow Along Nav

26 - Stripe Follow Along Nav 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript?...

技術 鼠年全馬鐵人挑戰 WEEK 21: JavaScript 箭頭函式 Arrow function

奶奶一臉震驚說:你...你是... 黑衣人說:我這次回來是要把我畢生所學給傳授下去。 小明腦中出現了很多想法,回來?畢生所學?什麼東西阿!搞得我腦子好亂! 黑衣...

技術 鼠年全馬鐵人挑戰 WEEK 15: 上上 下下 左左 右右 要怎麼解決呢? CSS nth-child

最近切版常常遇到看似規則,但又不規則,一下偏左,一下偏右, 在我還沒遇到nth-child前, 我的解決方式都是一千零一招,複製貼上各個class, 每次邊貼心...

技術 鼠年全馬鐵人挑戰 WEEK 20: JavaScript 函式 function

小明是某雜貨店的員工,有天店裡來了位客人,身著國民品牌uniqlo黑色的短T, 下著百搭卡其褲,腳採萬年不敗adidas拖鞋,走進店裡拿了一罐水、 二條七七乳加...

技術 鼠年全馬鐵人挑戰 WEEK 18: JavaScript 變數 型別

變數 變數命名規則 變數可以由字母數字下劃線和美元符號($)組成 變數必須以字母開頭 變數也能以 $ 和 _ 符號開頭 變數名稱對大小寫敏感(a 和 A 是不...

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

技術 鉄人28号FX 鉄人25号「圖形鹿」SVG <text> <tspan>

★ 地圖雷奧鎮市中心 ↓↓↓ 真不可思議~ 明明普通不過的街景, 為何隱藏這麼多無法理解的事情。 顯示雷奧鎮街上位置圖 雷奧鎮小巷 [???]: 小子。果然村長...

技術 [鼠年全馬鐵人挑戰] Week26 - JavaScript 練習題- 變數型別判斷與弱型別轉型

又是一個星期過去了 最近準備婚事真的忙翻啦~ 所以上週忘了更新文章了QQ 沒關係 再來繼續加油努力:) 變數型別判斷與弱型別轉型練習 請觀看此文章後,解答以下題...

技術 鼠年全馬鐵人挑戰 WEEK 22: JavaScript 判斷式 - if...else / switch

小明崩潰問道:難道奶奶、你和我都是程式所構成的嗎? 此時大家陷入沉默,不發一語 黑衣人打破沉默:如果你想知道這世界的真相,就問問真理吧! 在真理的世界只有 tr...

鐵人賽 自我挑戰組 DAY 3

技術 新手村03 - CSS Variables

03 - CSS Variables 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small step...

技術 鼠年全馬鐵人挑戰 WEEK 16: CSS Animation

CSS3 中有兩個用來做動畫的屬性,一個是 Transition,另一個是 Animation。 Animation 起手式 div{ animati...

鐵人賽 Modern Web DAY 2
實作經典 JavaScript 30 系列 第 2

技術 Day02:來做個鍵盤鼓手(一)

WES BOS系列影片 Alex快速導讀系列影片 Day01-JavaScript Drum Kit 思考需要的功能 1.按鍵按下後需要發出聲音 2.發出聲音的...

鐵人賽 自我挑戰組 DAY 19

技術 新手村19 - Webcam Fun

19 - Webcam Fun 俗話說的好,一天一蘋果,醫生遠離我 一天一 JS,What the f*ck JavaScript? small steps e...

鐵人賽 Modern Web DAY 15
實作經典 JavaScript 30 系列 第 15

技術 Day15: 自製的影片撥放器(一)

WES BOS系列影片 Alex快速導讀系列影片 今天要來製作自己的影片撥放器,覺得原始的控制套件很醜? 那就自己做一個,不過作者已經幫我們做好樣式了。 我們還...

技術 鼠年全馬鐵人挑戰 WEEK 19: JavaScript 運算子 運算式

以前數學課有個直線方成式y=ax+b,想必大家都不陌生吧! =、*、+,我們稱為運算子,而y=ax+b,就稱為運算式。 JavaScript 有以下常用的運算子...