iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

30天每天寫網站 系列

30天期間堅持每天寫一點點網站
可能是重新撰寫舊作業網站,也可能寫新的~

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

Day11-舊網站重寫成Vue_2_json抓取資料與渲染

今天要把「關於」的部分寫完首先因為架構是差不多的,所以我打算使用json做成文檔然後再抓取渲染先把文字都照ID、標題、內文創建好json檔回到HTML在date...

DAY 12

Day12-舊網站重寫成Vue_3_單一圖片輪播

今天來寫介紹那邊圖片輪播的功能 首先先寫一個陣列data放圖片 data: { img: [ "im/B3-0.jpg&quo...

DAY 13

Day13-舊網站重寫成Vue_4_TAB頁籤式選單

今天把INTRO的框架做出來首先先把之前舊網站的介紹板塊整理成json檔然後要把點擊標題切換內容的功能做出來我這邊是先在data區塊加了一個tab陣列,以存取三...

DAY 14

Day14-舊網站重寫成Vue_5_多圖片切換

昨天PO完文重看一下舊文才發現前天說要講json做輪播,結果昨天先講了tab….希望今天能講完輪播…先根據Day12的寫法寫出框架 <div id=&qu...

DAY 15

Day15-舊網站重寫成Vue_6_多圖片輪播

先寫時間輪播的部分一樣先做一個data預設 data: { time: [0, 3, 4, 2, 4, 4, 5] } 預設的數字是每一個"...

DAY 16

Day16-舊網站重寫成Vue_7_點擊滾動

今天終於把整個網站改完了 今天主要講點擊按鈕滾動至該區塊的部分 先把內容補完,因為我的留言版並沒有真正連結到後台,是裝飾用的,所以比較容易寫HTML跟CSS加上...

DAY 17

Day17-選取器_單選+多選

暫時沒有什麼小物件的想法今天寫一個簡單的多選+一鍵取消的超簡單選取器 首先先寫HTML <form> <div class=&quot...

DAY 18

Day18-選取器應用_串接json檔

今天把昨天寫的選取器跟顯示東西做串接首先先寫一個json,若會用firebase或App Script,也可以串接線上的這邊做一個比較簡單的,是地區縣市分類然後...

DAY 19

Day19-Flex屬性_超簡單製作導覽列

今天來介紹運用CSS的flex屬性,超簡單製作導覽列預想是電腦版左邊有LOGO,右邊有nav選單手機板左邊是LOGO,右邊會出現漢堡選單的圖樣,點擊後拉開隱藏的...

DAY 20

Day20-自製下拉式選單_我就想要美美的

今天來弄一個自製的漂亮下拉式選單 首先下拉式選單,會有上面可以按的地方跟下方會彈出來的懸浮按鈕我這邊直接設置了兩個圖樣,一個是向上一個向下,剛打開網站時應該是沒...