iT邦幫忙

鐵人檔案

第 12 屆 iThome 鐵人賽
回列表
Modern Web

前端網頁設計學習旅程 系列

未來三十天預計會從環境建置開始,依序學習 HTML、CSS、網頁排版與切圖,希望在鐵人賽結束後,有能力從無到有做出簡單的網站

鐵人鍊成 | 共 30 篇文章 | 2 人訂閱 訂閱系列文 RSS系列文
DAY 21

Day21_Bootstrap-Get Start

Boorstrap Bootstrap 是一個由 HTML、CSS 和 JavaScript 寫成的前端框架。他預先定義好大量的元素設定,讓你可以方便地引用,而...

DAY 22

Day22_Bootstrap-Nav Bars

Nav Bars 導覽列以 HTML5 的 nav 元素為主角,通常放在網頁的最上方,如下面的 HTML5 結構圖所示 練習 首先,先做一個常見的Nav Bar...

DAY 23

Day23_Grid System

Grid System 在 Bootstrap4 的 Layout 使用的是 CSS flexbox 來達到排版的效果,因此建議可以先瞭解 flexbox 屬性...

DAY 24

Day23_Bootstrap-Flexbox

Flexbox Bootstrap 4 與 3 在佈局上最大的不同,就是 4 使用了 Flexbox來做佈局。Flexbox 是 CSS3 提供的新的佈局方式,...

DAY 25

Day25_Deploy

學到目前為止,也算是有個基礎能力可以建置一個簡易的網站了接著要嘗試把開發後的網站,部署到雲端的環境上 AWS 這邊嘗試的是把網頁丟到 AWS 的雲端空間 S3中...

DAY 26

Day26_Deploy-CloudFront

ACM AWS Certificate Manager 是一種服務,可讓您輕鬆佈建、管理和部署能與 AWS 服務和您的內部連線資源搭配使用的公有與私有 Secu...

DAY 27

Day27_Vuejs-hello world

VueJS目前算是比較熱門的前端語言,官方文件也相對清楚。下面試著跟著網路上的資源,建置一個 hello world 的專案 Node.js 首先到官網下載安裝...

DAY 28

Day28_vuejs-get starts

首先先簡單顯示訊息,了解資料傳遞的方式試用Vue.js的最簡單方法是使用JSFiddle Hello World範例 // html <script sr...

DAY 29

Day29_CSS3

突然回到CSS好像有點跳tone,主要是因為在CSS & Javascript的基礎不夠熟練vue學起來有些吃力,還是得好好把基本功練熟 CSS3 CS...

DAY 30

Day30_CSS3-Text效果

繼續介紹CSS3的文字效果 文字陰影 h1 { text-shadow: 5px 5px 5px #FF5500; } 方塊陰影 div { width...

髮量稀疏的中年大叔的收藏
髮量稀疏的中年大叔的追蹤
髮量稀疏的中年大叔的Like
髮量稀疏的中年大叔的紀錄