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

0 Like 0 留言 942 瀏覽

鐵人賽 Modern Web DAY 12

連我阿公都會-手把手教你架網站系列第 12 篇

技術【Day12】讓網頁動起來（2）元老級插件jQuery！

上一篇中，我們淺談了JavaScript的基礎，但想要更加深入JS的領域，光有基礎的概念是遠遠不夠的。因此，本篇將為您借紹JS中的最受歡迎的元老級插件 ── j...

ttdragon0722 ‧ 2023-09-27 ‧團隊最強資工大電神

0 Like 0 留言 589 瀏覽

鐵人賽 SideProject30 DAY 17

30天製作RWD個人品牌網站系列第 17 篇

技術 Day17. 切版前知識(七) 響應式網頁(RWD) 介紹

今天要來說說RWD響應式網頁，應該大部分的人都有聽過或知道RWD這個名稱，他是現在網頁設計趨勢最基本需要具備的設計原則，幾乎可以說近年來的網站都會實現RWD或大...

luna0228 ‧ 2023-10-02

0 Like 0 留言 684 瀏覽

鐵人賽 Modern Web DAY 11

連我阿公都會-手把手教你架網站系列第 11 篇

技術【Day11】讓網頁動起來（1） → Javascript 速成

在前面的七篇中，我們講解了構成網頁設計的基礎要素：CSS。但這遠遠是不夠的，CSS只能賦予網頁靜態的美術效果與資訊展示。然而，我們對現代網站的期望通常都具備動態...

ttdragon0722 ‧ 2023-09-26 ‧團隊最強資工大電神

0 Like 0 留言 363 瀏覽

鐵人賽 SideProject30 DAY 16

30天製作RWD個人品牌網站系列第 16 篇

技術 Day16. 切版前知識(六) CSS動畫 Animation

今天是CSS最後一章，最後來講講CSS動畫，運用CSS能夠製作一些基本的動畫，讓畫面更有趣！除了前面說過的transition屬性能利用過渡效果呈現簡單的小動畫...

luna0228 ‧ 2023-10-01

0 Like 0 留言 562 瀏覽

鐵人賽 SideProject30 DAY 13

30天製作RWD個人品牌網站系列第 13 篇

技術 Day13. 切版前知識(三) CSS介紹、選擇器、常用屬性

嗨～從今天開始是一系列的CSS內容，前一章說到瀏覽器會讀取HTML轉譯成視覺化網頁，並搭配CSS、JavaScript使用。CSS負責網頁呈現的樣式、外觀，Ja...

luna0228 ‧ 2023-09-28

0 Like 2 留言 546 瀏覽

鐵人賽 SideProject30 DAY 15

30天製作RWD個人品牌網站系列第 15 篇

技術 Day15. 切版前知識(五) CSS偽元素 ::before、::after

嗨～今天是第15天！終於一半啦！！！今天要來談談CSS的偽元素，有了偽元素讓元素能添加更多效果、變化，網頁設計也能更多樣，是很常用的設定之一。前面的天數有談到：...

luna0228 ‧ 2023-09-30

0 Like 1 留言 1870 瀏覽

鐵人賽 SideProject30 DAY 11

30天製作RWD個人品牌網站系列第 11 篇

技術 Day11. 切版前知識(一) VSCode 使用教學、擴充套件推薦

嗨～接下來要開始進入切版了，開始切版前，有些必須知道的知識必須了解。之後切版會使用VSCode來做程式撰寫，今天先帶大家認識VSCode這個強大的前端開發軟體吧...

luna0228 ‧ 2023-09-26

0 Like 0 留言 760 瀏覽

鐵人賽 SideProject30 DAY 12

30天製作RWD個人品牌網站系列第 12 篇

技術 Day12. 切版前知識(二) HTML 教學、常用標籤

今天來説說切版時主要用到的技術之一：HTML5。HTML最為人熟知的就是，常用於設計網頁、行動裝置、應用程式等介面設計，網頁瀏覽器能讀取HTML並轉譯成視覺化網...

luna0228 ‧ 2023-09-27

0 Like 0 留言 498 瀏覽

鐵人賽 Modern Web DAY 10

連我阿公都會-手把手教你架網站系列第 10 篇

技術【Day10】前端撰寫（7）CSS框架

在前幾日中，我們總共講解了六篇CSS的基本屬性，內容之多，但都僅是蜻蜓點水的帶過而已，可見CSS的上限非常之高，學習它必然是一段漫長之路。以前在設計網頁時，我...

ttdragon0722 ‧ 2023-09-25 ‧團隊最強資工大電神

0 Like 0 留言 666 瀏覽

鐵人賽 Modern Web DAY 9

連我阿公都會-手把手教你架網站系列第 9 篇

技術【Day09】前端撰寫（6）淺談RWD響應式網頁設計

擷自 digitalsynopsis.com 在前面的篇章中，我們學習了如何撰寫CSS的各個屬性來設計出精美的網頁，但您是否有想過：「用電腦設計出來的網頁，為...

ttdragon0722 ‧ 2023-09-24 ‧團隊最強資工大電神

0 Like 0 留言 773 瀏覽

鐵人賽 Modern Web DAY 8

連我阿公都會-手把手教你架網站系列第 8 篇

技術【Day08】前端撰寫（5）CSS Position

在上一篇中，我們提到了CSS中，快速排版向的屬性：display: flex 。但有時，flex並不適用於較小且單一的元件，也無法協助我們更精細地刻出我們所想要...

ttdragon0722 ‧ 2023-09-23 ‧團隊最強資工大電神

0 Like 0 留言 293 瀏覽

鐵人賽影片教學 DAY 7

一起來實作響應式網頁設計系列第 7 篇

技術一起來實作響應式網頁設計：CSS的各種選擇器 Day7

影片教學重點回顧昨天的教學影片當中，我們了解如何轉寫CSS來套用到指定的選擇器當中，而昨天我們使用HTML的元素作為選擇器來套用，今天將要介紹其他選擇器，...

Ericostco ‧ 2023-09-22

0 Like 0 留言 640 瀏覽

鐵人賽 Modern Web DAY 7

連我阿公都會-手把手教你架網站系列第 7 篇

技術【Day07】前端撰寫（4）CSS Flex屬性，並使用Flex做一個簡單頁尾（Footer）

在本篇中，我們將介紹CSS中的flex。如同它的名字flex般，這個屬性非常具有彈性，有著能夠適應各個網頁縮放比例的自適應能力，可以說是我們在做網頁設計中的排版...

ttdragon0722 ‧ 2023-09-22 ‧團隊最強資工大電神

0 Like 0 留言 674 瀏覽

鐵人賽 Modern Web DAY 6

連我阿公都會-手把手教你架網站系列第 6 篇

技術【Day06】前端撰寫（3）CSS基本樣式

在上一篇中，我們學習了如何選擇並指定我們所需的元件並對其進行客製化。本篇我們來將淺談一些CSS基本、又好用的樣式，了解這些屬性，保證能讓您在網頁設計上更加得心應...

ttdragon0722 ‧ 2023-09-21 ‧團隊最強資工大電神

0 Like 0 留言 833 瀏覽

鐵人賽 WordPress DAY 11

【輕鬆學習，輕鬆教學】跟著我的步驟，輕鬆架設屬於你的學習管理平台！系列第 11 篇

技術 Day11 網站設計工具 - Figma 設計師都在用的工具

網站設計工具 - Figma Figma是一個非常流行的設計和協作工具，特別適用於設計師和團隊。它允許使用者創建、共享、評論和協作設計項目。以下是對Figma...

pellok ‧ 2023-09-22

0 Like 0 留言 630 瀏覽

鐵人賽 SideProject30 DAY 10

30天製作RWD個人品牌網站系列第 10 篇

技術 Day10. (補充)網頁設計好用工具、網站

終於來到第10天啦！今天再接再厲！網頁設計過程中，其實是很大的工程，往往都不是一天就能完成，今天就要來推薦一些網路上好用的工具、網站，適當配合能夠減少許多不必要...

luna0228 ‧ 2023-09-25

0 Like 0 留言 1061 瀏覽

鐵人賽 SideProject30 DAY 9

30天製作RWD個人品牌網站系列第 9 篇

技術 Day9. Figma(4) 製作Prototype原型

今天是最後一天的Figma教學，前面幾天介紹了Figma，並以Wireframe為例說明了主要功能的使用方法，應該都有感受到Figma的操作有多簡易、方便了吧！...

luna0228 ‧ 2023-09-24

0 Like 0 留言 940 瀏覽

鐵人賽 SideProject30 DAY 8

30天製作RWD個人品牌網站系列第 8 篇

技術 Day8. Figma(3) 製作Mockup視覺稿

第八天！今天要繼續Figma教學，接下來會先設定好視覺稿尺寸，再依據前面繪製的Wirefame並結合在Day4確定下來的網站風格、用色，忘記的可以回去複習。Da...

luna0228 ‧ 2023-09-23

0 Like 0 留言 553 瀏覽

鐵人賽 SideProject30 DAY 7

30天製作RWD個人品牌網站系列第 7 篇

技術 Day7. Figma(2) 插件推薦

嗨大家好，前面幾天內容有點多，今天來談談比較輕鬆的。Figma有許多強大的功能之外，也有許多神人提供插件，可以更多樣、方便製作想呈現的效果，這邊來介紹幾個我常用...

luna0228 ‧ 2023-09-22

0 Like 0 留言 1070 瀏覽

鐵人賽 SideProject30 DAY 6

30天製作RWD個人品牌網站系列第 6 篇

技術 Day6. Figma(1) 教學介紹、繪製Ｗireframe

嗨～從今天開始就是Figma教學了！不知道大家對網頁設計是否有初步的概念了呢？今天會簡單介紹Figma及基本操作方法，再用穿插教學的方式帶著大家使用Figma繪...

luna0228 ‧ 2023-09-21

0 Like 0 留言 470 瀏覽

鐵人賽 Modern Web DAY 5

連我阿公都會-手把手教你架網站系列第 5 篇

技術【Day05】前端撰寫（2）CSS選擇器

本篇文章中，將講述CSS的基本的使用方法。在此之前，我們要先了解甚麼是CSS？什麼是CSS？ CSS（層疊樣式表，Cascading Style Sheet...

ttdragon0722 ‧ 2023-09-20 ‧團隊最強資工大電神

0 Like 0 留言 580 瀏覽

技術 [DAY2]歸納網頁需求及製作網站架構圖

※這裡看上一篇文章↝ [DAY1]網頁設計與實作使用工具介紹好久不見（因為最近比較忙加上設計稿一直沒處理好所以現在才更新之後可能也沒辦法按時更但我會慢慢做完的...

70%off ‧ 2023-09-27

0 Like 0 留言 291 瀏覽

技術從WordPress主機到設計軟體：全面選擇指南

建立網站時，選擇適當的主機和設計軟體是一個重要的步驟。本文將指導你如何選擇最適合自己的WordPress主機和設計軟體。首先，需要了解什麼是WordPress...

jasminecheng ‧ 2023-09-18

1 Like 0 留言 718 瀏覽

鐵人賽 Modern Web DAY 4

連我阿公都會-手把手教你架網站系列第 4 篇

技術【Day04】前端撰寫（1）HTML基本架構

在上一天篇的貼文中，想必你各位都已經把環境給設置好了吧。是不是迫不期待想開發一個屬於你的網頁了呢？別急，就讓我們開始吧！首先，想要學習網頁，必須要先認識 HT...

ttdragon0722 ‧ 2023-09-19 ‧團隊最強資工大電神

1 Like 0 留言 542 瀏覽

鐵人賽 Modern Web DAY 3

連我阿公都會-手把手教你架網站系列第 3 篇

技術【Day03】工欲善其事，必先利其器～

俗話說的好：「工欲善其事，必先利其器。」這句格言在各個領域都有著深刻的意義。好比如，在寫作業的時候，先整理桌面和環境，可以使我們的思緒更加清晰，以提升工作效率...

ttdragon0722 ‧ 2023-09-18 ‧團隊最強資工大電神

0 Like 0 留言 518 瀏覽

鐵人賽 SideProject30 DAY 5

30天製作RWD個人品牌網站系列第 5 篇

技術 Day5. 網頁UI設計-Wireframe線框稿

到Day5啦！已經到個小段落了，那就再說明一下，這次的挑戰是以我的作品集為範例，分享給大家RWD靜態網站從頭到尾的製作過程，希望過了這30天你也能創造屬於自己的...

luna0228 ‧ 2023-09-20

0 Like 0 留言 492 瀏覽

鐵人賽 Modern Web DAY 2

連我阿公都會-手把手教你架網站系列第 2 篇

技術【Day02】網頁的基礎設計理論

所謂：「知己知彼，百戰不殆。」，在設計一個網頁之前，先充分了解其外部的各項特性，才能避免在實作時因千萬頭緒使您一時無從下手，而陷入窘境。因此，本篇將為您介紹在...

ttdragon0722 ‧ 2023-09-17 ‧團隊最強資工大電神

0 Like 0 留言 464 瀏覽

鐵人賽影片教學 DAY 1

一起來實作響應式網頁設計系列第 1 篇

技術一起來實作響應式網頁設計：HTML的架構 Day1

教學影片網頁前端三巨頭說到網頁前端，一定會聽到及碰到這三種語言，分別是：HTML,CSS以及JavaScript，而這三者對於網頁前端的地位簡單比喻可以如...

Ericostco ‧ 2023-09-16

0 Like 0 留言 484 瀏覽

技術 [DAY0]30天挑戰從零開始設計並實作網頁

雖然不小心錯過了鐵人賽的報名，還是希望可以利用此機會複習過去所學內容並養成學習的習慣，因此這邊將利用30天的時間，從製作設計稿開始，一步一步做出自己設計的網頁，...

70%off ‧ 2023-09-16

0 Like 0 留言 422 瀏覽

鐵人賽 SideProject30 DAY 4

30天製作RWD個人品牌網站系列第 4 篇

技術 Day4. 如何制定網站內容？

有了靈感以後，就要開始規劃網站要放入什麼內容啦！每個人的方式不太一樣，可以善用「5W1H」來思考，也就是Why、What、Where、When、Who、How，...

luna0228 ‧ 2023-09-19

技術 【Day12】讓網頁動起來（2）元老級插件jQuery！

技術 Day17. 切版前知識(七) 響應式網頁(RWD) 介紹

技術 【Day11】讓網頁動起來（1） → Javascript 速成

技術 Day16. 切版前知識(六) CSS動畫 Animation

技術 Day13. 切版前知識(三) CSS介紹、選擇器、常用屬性

技術 Day15. 切版前知識(五) CSS偽元素 ::before、::after

技術 Day11. 切版前知識(一) VSCode 使用教學、擴充套件推薦

技術 Day12. 切版前知識(二) HTML 教學、常用標籤

技術 【Day10】前端撰寫（7）CSS框架

技術 【Day09】前端撰寫（6）淺談RWD響應式網頁設計

技術 【Day08】前端撰寫（5）CSS Position

技術 一起來實作響應式網頁設計：CSS的各種選擇器 Day7

技術 【Day07】前端撰寫（4）CSS Flex屬性 ，並使用Flex做一個簡單頁尾（Footer）

技術 【Day06】前端撰寫（3）CSS基本樣式