iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

0 Like 0 留言 141 瀏覽

技術 30天做出一個線上相簿

Day 15 學習報告主題：使用 LocalStorage 儲存圖片資訊一、學習目標在這一天，我希望讓相簿的內容能被「永久保存」。以前每次重新整理網頁，所...

yuuuun ‧ 2025-10-18

0 Like 0 留言 143 瀏覽

技術 30天做出一個線上相簿

Day 14 學習報告主題：新增幻燈片播放模式（全螢幕播放圖片）一、學習目標這一天的目標是讓相簿更具互動性與展示性。我希望使用者能在瀏覽照片時，像看幻燈片...

yuuuun ‧ 2025-10-17

0 Like 0 留言 139 瀏覽

技術 30天做出一個線上相簿

Day 13 學習報告主題：排序功能完成一、學習目標本日的目標是讓使用者可以更方便地瀏覽相簿內容，因此我加入了「排序功能」。這個功能能讓使用者依照上傳順序...

yuuuun ‧ 2025-10-17

0 Like 0 留言 142 瀏覽

技術 30天做出一個線上相簿

Day 12 學習報告主題：搜尋功能一、學習目標今天的重點是讓相簿能夠支援「搜尋功能」，讓使用者可以快速找到想要的照片。隨著上傳的圖片越來越多，如果沒有搜...

yuuuun ‧ 2025-10-17

0 Like 0 留言 173 瀏覽

技術 30天做出一個線上相簿

Day 11 學習報告主題：相簿分類功能一、學習目標今天的主要目標是讓相簿能夠支援「圖片分類」的功能。這樣使用者在上傳照片時，可以選擇不同的分類（例如：旅...

yuuuun ‧ 2025-10-16

0 Like 0 留言 151 瀏覽

技術 30天做出一個線上相簿

Day 10 學習報告主題：多圖片上傳與相簿顯示一、學習目標今天的主要目的是讓線上相簿具備「圖片刪除功能」。在前幾天的開發中，已完成上傳、預覽與分類等核心...

yuuuun ‧ 2025-10-16

0 Like 0 留言 144 瀏覽

技術 30天做出一個線上相簿

Day 9 學習報告主題：圖片重新選擇功能一、學習目標今天的目標是讓使用者能夠「重新選擇圖片」──也就是在上傳錯誤或不滿意圖片時，可以再次挑選新檔案覆蓋原...

yuuuun ‧ 2025-10-16

2 Like 0 留言 127 瀏覽

技術 30天做出一個線上相簿

Day 8 學習報告主題：多圖片上傳與相簿顯示一、學習目標今天的主要目的是讓系統能同時壓縮多張圖片，這樣使用者上傳多張照片時，不僅能節省空間，也能保持載入...

yuuuun ‧ 2025-09-24

2 Like 0 留言 123 瀏覽

技術 30天做出一個線上相簿

Day 7 學習報告主題：圖片壓縮功能一、學習目標這一天的目標是學習如何使用JavaScript在不失真太多的情況下壓縮圖片大小，以便讓上傳速度更快、相簿...

yuuuun ‧ 2025-09-23

2 Like 0 留言 118 瀏覽

技術 30天做出一個線上相簿

Day 6 學習報告主題：圖片資訊顯示（尺寸、大小、檔名）一、學習目標這天的任務是讓每張圖片除了顯示檔名與大小之外，也能同時顯示「寬高尺寸」。這能幫助使用...

yuuuun ‧ 2025-09-22

2 Like 0 留言 110 瀏覽

技術 30天做出一個線上相簿

Day 5 學習報告主題:圖片上傳與即時顯示一、學習目標今天的目的是讓上傳的多張圖片能同時顯示在畫面上，並且每張圖片都有屬於自己的資訊卡。這樣的設計能讓線...

yuuuun ‧ 2025-09-21

2 Like 0 留言 127 瀏覽

技術 30天做出一個線上相簿

Day 4 學習報告主題:圖片壓縮與尺寸調整一、學習目標今天的任務是讓使用者上傳的圖片自動壓縮成合適大小，以提升載入速度並節省儲存空間。這對線上相簿的效能...

yuuuun ‧ 2025-09-20

0 Like 0 留言 179 瀏覽

技術 30天做出一個線上相簿

Day 2 成果報告主題：統一排版與主題色設計一、學習目標在第二天的任務中，我的目標是讓整個網頁的排版更有一致性，並透過主題色統一整個視覺感。這有助於提升...

yuuuun ‧ 2025-09-18

0 Like 0 留言 87 瀏覽

鐵人賽 Modern Web DAY 4

程式小白的 30 天轉職挑戰系列第 4 篇

技術 Day4｜HTML/CSS/JavaScript 的三角關係

網頁是什麼？學網頁設計的時候，常常會聽到三個名字：HTML、CSS、JavaScript。它們是構成網頁的三大元素： HTML 網頁的結構。 CSS 網...

L ‧ 2025-09-18 ‧團隊好想工作室 v 9.0

0 Like 0 留言 139 瀏覽

技術 Day 2 HTML 文字與排版

常用的文字標籤 HTML 提供了許多標籤來幫助我們排版：h1 ~ h6：標題（h1 最大，h6 最小）p：段落（paragraph）ul / ol：清單（ul...

32499522 ‧ 2025-09-17

3 Like 0 留言 120 瀏覽

技術 30天做出一個線上相簿

Day3成果報告主題:單張圖片上傳與預覽功能一、學習目標本日目標是讓使用者可以上傳一張圖片並即時預覽，體驗基本的圖片顯示功能。這是線上相簿的核心功能之一，...

yuuuun ‧ 2025-09-19

1 Like 1 留言 272 瀏覽

技術 Day 1 認識網頁的基本結構

網頁是怎麼組成的？一個網頁最基本的就是 HTML（HyperText Markup Language）。它就像是房子的骨架，決定了內容要怎麼擺放。HTML 通常...

32499522 ‧ 2025-09-16

0 Like 0 留言 232 瀏覽

技術 30天做出一個線上相簿

Day 1 成果報告主題：專案初始化與結構建立一、學習目標今天的目標是為整個線上相簿網站建立統一的基礎結構。主要重點在於打造一個乾淨、穩定、可延伸的 HT...

yuuuun ‧ 2025-09-17

0 Like 0 留言 65 瀏覽

鐵人賽 Modern Web DAY 3

程式小白的 30 天轉職挑戰系列第 3 篇

技術 Day3｜與JavaScript初次相遇

JavaScript是什麼 JavaScript 的誕生，其實有點戲劇化。為了輔助Java的存在,Brendan Eich在當年網景公司(Netscape)...

L ‧ 2025-09-17 ‧團隊好想工作室 v 9.0

0 Like 1 留言 428 瀏覽

鐵人賽 Modern Web DAY 1

30天一起搞懂Web觀念系列第 1 篇

技術 [DAY1] HTML 是什麼？為什麼是這樣設計？

前言哈囉～我是Joanne，目前是大四，也是我第一次參加鐵人競賽。我學網頁一段時間了，雖然沒有很厲害，但也開發過大大小小的網頁專案（前端的比較多），知道什麼時...

joanne0119 ‧ 2025-08-04

1 Like 0 留言 1394 瀏覽

技術 HTML 入門筆記 - 2 - HTML 架構與基礎語法

🔹 HTML 基本架構 <!DOCTYPE html> <html lang="zh-TW"> <head...

zoelinrd ‧ 2025-04-08

2 Like 0 留言 1554 瀏覽

技術 HTML 入門筆記 - 1 - 認識 HTML 與網頁結構

🔹 什麼是 HTML？ HTML（HyperText Markup Language，超文本標記語言）是建立網頁的基本語言。 HTML不是程式語言，而是...

zoelinrd ‧ 2025-03-25

1 Like 0 留言 2083 瀏覽

技術 [一天一學習直到我完成任務管理系統] Day 4 前端檔案建立(以菜單網站為觀摩範本)

Day 4: 1140112一、目標:觀摩如何依照MVC架構，建立Java專案中的前端檔案二、預計使用工具:VS code 三、檔案架構:今天要建立的是前端檔案...

hermosaliang ‧ 2025-01-12

1 Like 0 留言 1446 瀏覽

鐵人賽 Python DAY 21

從概念到應用：Python實戰開發學習之旅系列第 21 篇

技術 [Day20] Python專案 - 爬蟲程式 - (2) 擷取你的需求資料(瀏覽器或裝置的意義)

目標今天會帶大家使用 request json Beautiful Soup 嘗試擷取簡單的網頁資料麻煩大家先透過pip install...

科技狗(柯基狗) ‧ 2024-10-05

0 Like 0 留言 239 瀏覽

鐵人賽佛心分享-IT 人自學之術 DAY 17

一個網頁的誕生！教你從基礎到自行完成設計網站系列第 17 篇

技術設計網頁這麼簡單？除了html、css等還需要注意什麼

⬆️類似於這種，其實我們也可以自己用自己熟悉的編輯器寫出來！只要確定好html、css、java的分配，wix也有與javascript連結可自行創造的功能～這...

Corrina ‧ 2024-10-01

0 Like 0 留言 229 瀏覽

鐵人賽佛心分享-刷題不只是刷題 DAY 9

30 天克服前端面試系列第 9 篇

技術 Day 9 - 請描述 <script>, <script async>和 <script defer> 的差異為何？

透過<script>我們可以適當的控制腳本在瀏覽器載入的時機。 <script> 這是預設的腳本加載方式，在網頁渲染的過程中，會使用 &...

Ashley ‧ 2024-09-23

0 Like 0 留言 363 瀏覽

鐵人賽佛心分享-我的私藏工具箱 DAY 2

SUPER EASY CSS 前端切版百寶箱系列第 2 篇

技術 #01 前端支援度查詢：Can I Use / StatCounter / Can I email...

因為網頁的使用者可能使用各種裝置、各種瀏覽器瀏覽網頁，所以在開發前端時，要盡量讓網頁在所有情況下表現效果都一致。今天就分享很常見的查詢支援度的小工具，雖然應該...

Eva Chen ‧ 2024-09-16

0 Like 0 留言 470 瀏覽

鐵人賽 JavaScript DAY 2

歡迎參加我的原生JS畢業典禮系列第 2 篇

技術【Day1】JS同學你負責什麼？

說到前端、Web不外乎就會提到三巨頭HTML、CSS和JavaScript（JS），先跳脫專有名詞我們來發揮想像力，解釋這三種語言是如何彼此配合？假設你在台北...

ivytien ‧ 2024-09-16

0 Like 0 留言 532 瀏覽

鐵人賽 Modern Web DAY 8

從零開始：全端新手的困境與成長系列第 8 篇

技術 Day8 要開始寫程式了，但我對 CSS、TypeScript 和 HTML 不熟，怎麼辦？(上)

要開始開發程式啦！寫程式是一個令人很興奮的過程，但又充滿挑戰，尤其當你發現自己對一些核心技術不熟的時候，這種不確定性可能會讓你覺得很糟糕也很焦慮。HTML、CS...

Chiayu ‧ 2024-09-16

0 Like 0 留言 3306 瀏覽

鐵人賽 Modern Web DAY 2

Super Easy CSS，極度簡單 PART 2！寫出漂亮的 CSS 系列第 2 篇

技術 #36 HTML <video> 用影片當背景，使用 iframe 嵌入 Youtube自動播放/ IG/ TikTok/ X (Twitter) 影片

本篇同步發表於我的 Hashnode 部落格：Eva Chen | 網頁設計師下班後 (hashnode.dev) ↓ 今日學習重點 ↓ 使用 H...

Eva Chen ‧ 2024-09-16

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 30天做出一個線上相簿

技術 Day4｜HTML/CSS/JavaScript 的三角關係

技術 Day 2 HTML 文字與排版

技術 30天做出一個線上相簿

技術 Day 1 認識網頁的基本結構

技術 30天做出一個線上相簿

技術 Day3｜與JavaScript初次相遇

技術 [DAY1] HTML 是什麼？為什麼是這樣設計？

技術 HTML 入門筆記 - 2 - HTML 架構與基礎語法

技術 HTML 入門筆記 - 1 - 認識 HTML 與網頁結構

技術 [一天一學習 直到我完成任務管理系統] Day 4 前端檔案建立(以菜單網站為觀摩範本)

技術 [Day20] Python專案 - 爬蟲程式 - (2) 擷取你的需求資料(瀏覽器或裝置的意義)

技術 設計網頁這麼簡單？除了html、css等還需要注意什麼

技術 Day 9 - 請描述 <script>, <script async>和 <script defer> 的差異為何？

技術 #01 前端支援度查詢：Can I Use / StatCounter / Can I email...

技術 【Day1】JS同學你負責什麼？

技術 Day8 要開始寫程式了，但我對 CSS、TypeScript 和 HTML 不熟，怎麼辦？(上)

技術 #36 HTML <video> 用影片當背景，使用 iframe 嵌入 Youtube自動播放/ IG/ TikTok/ X (Twitter) 影片

標記使用者

技術 [一天一學習直到我完成任務管理系統] Day 4 前端檔案建立(以菜單網站為觀摩範本)

技術設計網頁這麼簡單？除了html、css等還需要注意什麼

技術【Day1】JS同學你負責什麼？