iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

30天每天寫網站 系列

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

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

Day21-大量圖片的頁面(上)_利用grid快速排版

今天來用grid+hover做一個介紹景點的排版~ 先看成品 首先一樣是先整理一個json檔案 HTML的部分,最外框container,裡面有標題跟內容 &l...

DAY 22

Day22-大量圖片的頁面(下)_利用hover搞點漂亮的

承昨天的繼續 接著就進入美化的部分首先最重要的是要讓圖片符合我們的框框大小先將包裹所有內容的.attraction_hover的高度寬度都拉滿然後因為我的圖片比...

DAY 23

Day23-按鈕分身術(上)_純CSS漢堡圖樣與改變

今天明天要來寫純CSS可控制的按鈕分身術感謝室友的idea提供~ 之前在重寫網站時的首頁按鈕也是類似的效果只要把改變的位置更改就能做出不同的樣子了 今天的部分著...

DAY 24

Day24-按鈕分身術(下)_我的分身想去哪

今天來繼續寫按鈕分身術 昨天完成了控制鈕的部分今天來寫分身按鈕在HTML的label下面新增需要的按鈕數量 <a class="menu-ite...

DAY 25

Day25-jQuery的一點小轉場_會打開的搜尋欄

今天寫一個簡單的搜尋欄樣式有時候會在navbar上看到那種搜尋鍵,按下去後搜尋欄會拉開變出可以打字的地方今天就在做這個~ 首先先寫HTML用一個div把inpu...

DAY 26

Day26-用jQuery寫得出ToDoList嗎_1_新增list沒什麼問題

這應該是這次參賽的最後作品了來挑戰用jQuery做一個ToDoList首先先寫簡單的架構一個input,一個送出button,跟要放進template的li架構...

DAY 27

Day27-用jQuery寫得出ToDoList嗎_2_搞個4碼隨機碼給id使用吧

今天要先把昨天寫的東西都給挪到陣列之中,所以我們會需要一個空的陣列這個陣列因為多個函式會使用到,記得要放在最外層 然後寫一個addTodo的function,讓...

DAY 28

Day28-用jQuery寫得出ToDoList嗎_3_id的重要性與作用

首先先來寫id的使用我們要做一個隨機碼id的用意是因為,如果我們需要去對特定的label做改變我們需要能抓取到它的唯一id我一開始是使用content去當辨別的...

DAY 29

Day29-用jQuery寫得出ToDoList嗎_4_單機版ToDoList沒有問題!

這篇來說剩下的重要功能 先來寫刪除的部分就叫做removeTodo吧加在a連結上,一樣需要回傳thisJS的部分概念比較好理解一樣抓取到id之後,去掉我們多加上...

DAY 30

Day30-我也想要寫感言_終於解脫啦

不免俗地來個結賽感言 很榮幸參加了這一屆的IT鐵人競賽以前並不知道這個比賽,後來才發現,以往在學習寫網站時看到的很多文章,其實都是來源於IT鐵人賽的文章呢 這次...