3天!動手寫網頁 (實戰系列)

課程資訊 課程大綱 開課單位 常見問答
Loading...
線上課程

3天!動手寫網頁 (實戰系列)

1063次瀏覽
NT$2,990
優惠現領
9 折
【11/12-11/30優惠】
課程資訊
本頁面課程內容及活動資訊概由廠商提供,部分內容非屬104服務範疇,會員應遵守之規範悉依 104課程中心會員規約 所載。
上課時間 無限期觀看課程查看更多
上課方式 於開課單位網站兌換後觀看課程
課程內容
課程大綱
展開全部
1 網站的骨架:HTML 基礎
01
課前閒聊
02
【網頁架構】到底是什麼?
03
【HTML 標籤】(tag) 是什麼?
04
【常用標籤】與他們的用途
05
替【架構】取名字:如何使用【id】與【class】
06
HTML 其實是一種【樹狀結構】嗯?可以吃嗎?
2 CSS 選擇器 (selector):選擇要改變【誰】的長相
01
CSS 的寫法
02
【CSS 選擇器】
03
練習:一起來選選看吧!
3 CSS layout:排版工程學
01
display:顯示的特性
02
position:相對位置屬性
03
float & clear:文繞圖與排版
4 CSS 細節設定
01
box model
02
background:背景設定
03
font 相關:文字相關設定
04
其他
5 CSS 權重
01
【權重】觀念與調整方法
6 【實戰練習】「設計圖」大解析
01
行前準備:IDE 工具
02
Wireframe:手繪分析稿,讓架構一清二楚
7 【實戰練習】使用 HTML 製作網站架構
01
初始設定
02
header > nav 與假資料們
03
content > slider / category / Grid 概念 / HTML 特殊字元
04
content > recent-product / event / 假字
05
content > event / feature / 假按鈕
06
content > outlets / email 連結 / 新分頁連結
07
footer > 內容 / go top
08
HTML 架構完成後的長相
09
額外練習
8 【實戰練習】CSS 魔法:替架構披上美麗外皮
01
初始設定:串連 HTML 與 CSS 檔案
02
container / header / 置中的辦法 / 用 float 來排版
03
nav 的諸多調整,與 UX 細節
04
關於 clearfix
05
#header 回顧
06
slider / category / Grid 的實作方法 / 圖片服貼容器 / 文字的設定
07
slider 與 category 回顧
08
recent product / 標題
09
Grid 左右邊界 對齊問題
10
product 的細節設定
11
大解析:滑鼠移上 product 後顯示資訊的架構
12
CSS 3:滑鼠移上 product 後的動態效果
13
recent product 回顧
14
額外練習
9 【實戰練習】CSS 魔法 #2:將簡陋架構,轉變為美麗網頁
01
休息一下:談談 CSS 的單位
02
繼續練習:event / 背景圖片設定 / 假按鈕外觀
03
feature
04
按鈕的多樣性
05
margin 崩塌 (margin collapse)
06
feature / outlets / 分割線
07
footer / logo 的出格 / 第三種置中 / 用 CSS 做出圓形
08
go top 回到頂端按鈕
09
整體回顧
10
訓練總結
10 外傳【切版秘笈】:常見的排版方式與製作方法
01
基礎切版架構:版面置中
02
兩欄式架構、三欄式架構
03
常見版面介紹:nav
04
破格設計
05
特殊版面介紹:圖片常見的問題與解法
06
cover info:覆蓋在圖片上的資訊
07
下一步?
你可以學到
課程講師
吳欣培
自行接案、擔任網頁開發公司 Senior 網頁工程師期間開發了許多網站、手機 app、網路服務等後因設計師朋友想學網頁相關的技能遂開發【網頁基礎15天】等相關課程以簡單易懂、貼近實際應用的訓練著稱
展開全部
開課單位
緯育TibaMe
緯育TibaMe由全球最大資通訊集團之一的緯創資通集團於2015年正式成立,我們專注於人才培訓與平台服務,發展多元的授課模式,並結合緯育開發的雲端智能化學習系統,有效培育新世代數位化人才。在行動與雲端時代,用科技加值人才培育,持續發展創新與有效的數位教育學習服務。
最新動態 看所有動態

【限時最高抽整筆免單】即刻佈局 2026 你需要的職能力,全站 88 折開跑中

🤔 職涯盤點年年做,為何行動力總歸零? ​如果你也曾有這樣的感覺: 🔸 盤點結果總流於表面,無法連結到實際的晉升或轉型目標? 🔸 被 AI 焦慮追著跑,卻不知道怎麼將它變成個人工作槓桿? 🔸 投入大量時間學習,卻鎖定不到職涯中「高價值回報點」? ​ 這次不僅讓你掌握不同盤點法的核心重點與使用時機, 再結合專業師資帶你導入過往經驗找到專屬「實踐→轉化」心法! 👉 https://tibame.tw/Bx6QL ​ ✅ 個人化「能力變現」技巧 ✅ ASK+E 經驗法則策略佈局法 ✅ 建構你的【終身 AI 職涯顧問】Prompt 技巧 ​ 限時預約專人從「ASK+E模型分析到建置 AI 顧問」線上教學只要 799 元 👉 https://tibame.tw/79F0P ​ ​ 📣 新註冊會員即贈送 200 元學習金 📣 活動加碼11~19~12/18 全站 88 折優惠再抽免單 領取 88 折>> https://tibame.tw/Bx6QL

免費直播】轉職前導課 - AI時代下,工程師的職涯趨勢與發展

AI 都會寫 code 了,我還能轉職工程師嗎? 別再猜了!讓我們用數據和真實經驗讓你看到趨勢、看到未來 帶你一探AI為軟體工程師打造的新藍海 📍 【免費直播】轉職前導課-AI時代下,工程師的職涯趨勢與發展 🔗 https://tibame.tw/1cMUa 讓你在 1.5 小時內掌握: ✅ AI 時代的 IT 產業趨勢與職涯方向 ✅ 哪些工程職位將迎來黃金紅利期 ✅ 非本科、零基礎如何跨入工程職 ✅ 緯育 TibaMe 如何陪你從學習 → 求職全程支援 🔥 現場加碼! 參加就送「轉職大禮包」,還有機會獲得價值「AI職涯顧問課程」 🗓️ 時間:11/20(四)12:00–13:30 🔗 報名連結:https://tibame.tw/1cMUa 👉 現在報名,明年就能換你上車!
常見問答
適用範圍只限於 104 學習平台,完成費用給付之課程
如何購買課程並開始上課
於欲購買 1. 線上課程之頁面,點擊「立即購買」,成功使用信用卡完成付款並確立訂單成立後,本平台將透過購買填寫之信箱,以郵件方式通知「訂單成立」,後續兌換學習有兩種形式:(A) 若購買學習廠商提供課程,購買後「提供課程兌換序號、兌換連結、兌換碼使用說明」,引導您至購買課程之出版廠商兌換並上課、(B)若購買是104學習系統,購買完可以從郵件、訂單明細、課程詳細頁直接進到站內線上學習。 2. 實體課程之頁面,點擊「立即購買」,成功完成付款並確立訂單成立後,本平台將透過購買填寫之信箱,以郵件方式通知「訂單成立」即可完成報名,後續開課單位會有專員與您聯繫後續事宜。
購買與報名課程付款方式?
僅提供信用卡付款。
有支援信用卡分期嗎?
平台有提供分期服務:結帳金額滿$4,000可享三期零利率,滿$12,000可享六期零利率;分期服務支援銀行公司為:中國信託、台新銀行、玉山銀行,實際分期金額依各發卡行規定
已完成付款,但用錯優惠碼怎麼辦?
請申請退款並重新下單,已使用之優惠碼,本平台將不進行退回,敬請見諒。
線上刷卡後訂單狀態顯示「待付款」
代表您的結帳流程尚未完成,請儘速完成結帳程序,以免課程相關優惠權益失效。
刷卡失敗的原因
可能為以下原因: 1.授權失敗(例:信用卡發卡銀行系統忙碌、網路塞車、刷卡等待時間過久造成系統確認失敗等問題),建議稍待一段時間再重新刷卡。 2.輸入信用卡卡號等相關資料不正確(例:輸入資料不正確、卡號過期、尚未開卡等問題),建議重新確認輸入資訊。
如何選擇紙本發票
為響應政府政策,不主動提供紙本發票,委由金財通系統寄發電子發票開立通知信至學員購買課程時填寫之Email,發票自動存入會員載具,若未收到請告知。
企業請款之憑證,如何申請
若需要進行企業請款,請於購買時輸入統一編號、發票抬頭,本平台將以郵件寄送電子發票方式,至您填寫之信箱。
多久會收到發票
發票將於付款成功,3個工作天內開立,敬請稍候。
如何退款
請參考下方退款須知與流程 1.若您於本平台成功完成付款購買課程,有退款需求,於外部學習廠商兌換之線上課程自購買日起7天內,且未進行課程兌換,可申請全額退費;於104課程中心站內學習課程若購買日起7天內後「未進到學習頁」,可申請全額退費;實體課程須於開課日前 1 日之非假日上班時段前與104學習提出申請,始得要求全額退費。 2.若需申請退款,請使用信件主旨:「課程中心退款申請」,並於信件內容寫明購買人姓名、訂單編號、欲退款之課程名稱,郵件至nabiservice@104.com.tw,本平台將於5個工作天內盡快為您處理。 3.確認提出退款申請時間為課程購買日起7天內,且未進行課程兌換,本平台將與欲申請退款課程之出版廠商,提出會員資料與學習紀錄查詢,確認您課程的觀看紀錄,並同步確認出版廠商訂定之退款事項,是否全數符合。申請退款的同時,即代表您同意本平台與退款課程之出版廠商,提出查詢會員資料與學習紀錄。 4.若您單一訂單中購買兩堂(含)以上課程,不需要整張訂單退款(只退其中幾堂課),退款金額為欲退款課程售價加總後,扣除此張訂單所使用之優惠碼(若優惠碼為整張訂單之折數折扣,則退款金額為欲退款課程售價加總後乘以折數折扣),若計算後退款金額低於(含)0元,本平台將不執行退款。5.上述退款方式僅限於本平台成功完成付款購買之課程,若付款與訂單成立之任一程序不在本平台完成,退款方式需依照課程出版之廠商所訂定之規則提出申請,並由課程出版廠商協助處理,本平台不介入。 6.若您的發票沒有填寫統一編號,並需要辦理退款時,由本平台代為處理發票相關作業 (如作廢電子發票或開立電子發票折讓單),以加速退款作業時程。 7.若您原訂單信用卡分期,其申請退費時,須整筆訂單全額退費,無法部分或擇一課程退費。
款項何時退回
信用卡一次付清:課程退費採原信用卡退刷方式,退費所需之工作天依各金融機構實際作業時間為準。 信用卡分期付款:課程退費採匯款方式,會將退款款項匯款到您的指定帳戶,將由專員與您聯繫提供相關資料,以利後續退款作業。