多點影音工作室 AI生成式網頁設計課堂教學影音5-2_block模板程式碼編修技巧

Name: 多點影音工作室 AI生成式網頁設計課堂教學影音5-2_block模板程式碼編修技巧
Uploaded: 2026-02-05T04:08:02.978Z
Duration: 46 min 29 s
Channel: 林金露_AI微型電商創業系統_網頁設計教學
Description: 這是林金露老師_在勞動部勞動力發展署桃竹苗分署_網頁設計課程的教學課堂錄影檔。 林金露老師教學網站有提供教材軟體,下載網址= https://linjinlu.com 歡迎你一起加入AI生成式網頁設計學習行列。

林金露_AI微型電商創業系統_網頁設計教學

2026年2月5日

這是林金露老師_在勞動部勞動力發展署桃竹苗分署_網頁設計課程的教學課堂錄影檔。
林金露老師教學網站有提供教材軟體,下載網址= https://linjinlu.com
歡迎你一起加入AI生成式網頁設計學習行列。

接下來我們就是要學習怎麼去運用我們所取得的這個版型我們再說一次版型取得來源我們已經跟你講了就是這些東西但如果只有這樣那不代表說你能用的就是這麼多而已可是如果你懂得借力使力就是說它有版型但是我們又經過學習之後我還可以再應用我可以弄到更深的而且甚至做出自己的專用的版型那纔是我們要學習的目標所以我們挑一個來就這個我們來運用接下來我們就是要來學會怎麼看得懂跟學會怎麼運用它好首先要了解版型一定要幹嘛你要先知道它是什麼特徵好同學我們來打開看一下你現在在這個操控區裡面你滑鼠過來有看到一張照片然後底下有字而且有標題跟內文滑鼠一過來它就會呈現別人就收縮起來這樣子好所以這個左眼在什麼互動同學你看影片影片在那邊一直跑一直跑跟你沒關係因為它一直在播嘛就像播電影一樣它一直在播嘛影片它一直在播嘛但我們網頁動畫是互動我怎麼樣它就會怎麼樣所以它動畫迷人是在說我能夠跟它互動好所以左眼在互動上那怎麼能互動所以一定是什麼一定是有程式碼來控制著好但是我們如果要從頭去學學那個程式碼哇太辛苦了所以我們只要知道它的原理我只要會拷貝貼上再來更改數字我就能夠控制它的話這就是我們要教你的目標好所以基本上我們數一下它的sample 一二三四五張好那我們想要把它變成六個那怎麼變 Mobilize說你想要變更從表面上你是不能做的那你一定要知道進程式碼所以它這邊幫你鎖住說你如果按的時候它說你要不要來download 你一按download 糟糕就跑到他們家去了他們家Mobilize官方去了它就跟你說要buy now 你要去買所以我們才說我們加了一個擴充那我們要用的就是這個因為我們找到那個 WITSEC那個網站了它有提供這個功能好那我們同學點到它好然後就會跳出這個畫面好這個畫面呢跟剛剛那個前臺你不要動喔看我畫面就好跟前臺剛好天跟地這裡都是視覺好那我們一按就進入了程式碼好那關鍵在於說老師看到這個我就頭痛對開始的時候你沒有學的話會那樣子但我們現在就是要教會你好雖然我們這一節比較重要的原因就是我要教會你看得懂而你是編寫程式碼的空白你是小白都沒有問題只要我們講過你就學會了好那要怎麼做第一件事情這邊有橘紅色的按鈕跟綠色按鈕好這個就儲存這個就是離開 Cancel 離開好你不要儲存就按這個離開來同學我們練一下按這個進入程式碼區按這個是不儲存然後離開再按一次注意喔點你的區塊不要弄錯如果你在上面是這一區這個block 我們現在遊標是在這裡是這個block 那這個是它原本的sample 我們要教會你變更所以要從這裡來而且我們的目標是要來製作一個你第二個席座都能夠運用上的東西 OK 好那我們把它按一下這個好那這裡面會有兩個區塊一個是左邊一個是右邊好那左邊一樣都有行號 1 2 3 4 5 這樣行號右邊是什麼呢右邊是CSS 這個是樣式表我們寫在筆記本上喔你畫一個圖畫一個方塊然後像畫面這樣畫一個方塊然後切兩半你在右邊寫這個是樣式表CSS 然後這邊呢左邊寫HTML 這個就是程式碼好這樣子你就會看懂這個畫面了 OK 好那程式碼裡面呢我們先從第一行這個第一行這個叫Session 好章節如果你把它翻 Session把它翻成中文的話就是章節嘛 OK 好那你把它當成我們在筆記上寫我們全部這個名字叫做 Block B-L-O-C-K 然後裡面的成分分為表皮你就寫上喔表皮好表皮就是這個 Session S-E-C-T-I-O-N Session 就是表皮表皮同學一樣喔你買蘋果對不對它就有一個表皮你買橘子有一個表皮所以幾乎喔所有的東西都有一個表皮我們人人類一樣有一個皮膚都是表皮好那我們一樣喔 Block 就是第一個第一層就有一個表皮好那表皮起頭結尾你找到最後面這個看到這個Session 你把它Enter隔開一點好這個就是Session 你把它隔開一點表皮上面這邊隔開一點同學找到那個程式碼進來喔好我們再講一次喔你加入這個怎麼加入還有同學沒有加進去喔來我再示範一下喔我把這個刪掉喔要怎麼加喔按這邊按搜尋找到 Image Video 按搜尋下去找到這個手風琴2 按一下按這邊 ADD Block To Page 好它就加進來了這個時候因為我們有裝了擴充所以就有這個然後按下去好我們說一個Block 都有一個表皮 Session 那表皮裡面筆記本做筆記本包含三種成分第一這一段叫做前端控制介面好那我們寫在筆記本表皮裡面的成分就是Block的成分一外面叫表皮裡面有三個東西第一個叫前端控制好它是用英文 MBR 跟PRA PARAMETER 這個好你不用管它英文這是什麼意思就這樣這樣這一段好同學你像這樣你看我畫面然後你自己框你的畫面你用你的滑鼠去框那個畫面好找到之後在它的屁股後面這邊 Enter一下隔開一點好再來第二層呢第二個你寫在你的筆記本上喔第二個叫做判斷條件好那這個範例沒有你不要動喔我呢找一個有的範例給你看好例如我回到這個你不要動喔那我按任何一個程式碼進來你看喔像這裡裡面這一條程式碼你看前面這個是前端控制下來的第一行只要有看到這個if 好我們就寫在筆記本只要看到這個老師拿的if 有 mvr-if 好那mvr是什麼 mvr是mobilize的縮寫這是他們自己稱呼自己好 mvr 然後-if 只要你看到這個這個就叫做寫在我們的2 判斷條件好它的底下就屬於第三區寫在筆記本上喔第三區叫做程式內容好那是不是每個block 都有含這三個不見得但至少都有兩個好現在回到我回到跟你同步喔在藝術展覽系列裡面這個好那我們從這裡繼續你看喔這個是前端控制下一行沒看到那個if 所以這個版型就沒有判斷條件它就直接就是第三區叫做程式內容好一直到這邊注意看喔這個程式內容一直往下來一直到這邊到這裡都是程式內容哇老師好長喔對不用怕喔我們一一的解析你就會懂好那我們先做好筆記喔一個block 就像一個蘋果對吧一定有一個表皮那你把表皮削掉裡面就有果肉嘛對不對那裡面一定有一個果核對不對那個吃了會中毒的那個小狗也不能吃人也不能吃啊因為那有果核 OK 好那你就知道它的成分那我們講我們的block 成分就是一表皮二那裡面就有一個前端裡面有三個成分嘛前端控制老師什麼是前端控制前端控制指的就是你不要動喔前端控制指的就是這個齒輪按下去得到的這個這個就是前端控制 OK 好啊底下的就是程式內容程式內容就是展現的內容被控制的內容 OK 好那現在我們要開始來編寫就是加入內容嘛怎麼加呢先看前端前端喔這裡面第一個這一行喔這一行叫做 top 有沒有看到這裡面有一個title叫top top 就是上 bottom 就是下好你把這兩行遊標遊標在這個屁股後面我們把它稍微隔開喔找出這兩行來這兩行我們主要看的是這個 top 你要看這個英文就title這個地方它的橘紅色的部分就top跟bottom 好那程式碼的英文就是那麼幾個字而已啦不會超過一百個啦你要認識的東西不會超過一百個好那最常的就是上下好然後再來認識這邊 m i n 就是最小 m a x 就是最大然後它等號雙語號裡面有一個數字是8 同學把這個8後面加一個0 讓它變成80 什麼意思加大尺寸啊就像你買東西那個size不合你就加大尺寸叫老闆重新幫我訂做一個加大尺寸就這樣而已啊你現在就是那個加大尺寸的人只要注意喔 min m i n 就是最小最小從0開始啊沒有負的所以0不要改你要改的人事情都只有最大的那一個好來這是上面距離上面最大為80 那底下是距離底下你一樣 8而已 8不夠用啊來再加後面加一個0 80 這樣你會吧就這樣而已找到上邊距這個叫上邊距下邊距老師什麼是上邊距喔同學就像你現在你現在是作者對不對你距離屋頂尺寸多高那叫上邊距你現在只要踩地嘛啊往底下算就是你的底下的距離就這樣好啊你告訴他 8不夠用我要把它變80 好來存起來按這個儲存然後現在喔按齒輪 Tab 喔你看現在就加大了喔現在就縮小了 0就是很緊靠很緊貼上面喔然後就是這樣子他本來預設是8嘛就高低給你自己調的高低給你自己調的好那來了我們上面不是有一個嗎我們上禮拜上一次做的對不對把這個可以砍了現在只用這個你看距離就是上面這個選單你如果喔是這樣子你如果是零距離哇你的圖案就跟選單重疊所以這樣就不好看嘛所以就要加大那個距離好那底下還露出來啊所以表示這個高度不夠高啊這個底部加大距離這樣我就可以滿版喔原來是從這裡控制如果是零就變這樣喔啊他本來只有8嘛 8不夠用你看如果這個是8 底下還露了一個潔白的啊這樣的話我來做那個整個滿版的話就不夠用所以為什麼我們要改數字就是啊我就可以加大一點都沒有問題的好現在再回來一次喔先按這個再回到程式碼經由我們這樣解釋你就會知道了找到top top top你一定懂嘛上啊 bottom 就是底上跟下而已然後呢 min是最小 max是最大這個我們都懂啊你加變成把它變成80 注意喔這個一句這樣是一句完整的喔有藍綠色的名字等號雙引號啊裡面呢數字叫做值價值的值所以你打字的時候千萬不要把雙引號弄掉喔一弄掉就程式就會崩潰了你只要看仔細插進去打上就好了好恭喜現在你就會了好那這裡有一個value value就是剛剛你我剛剛在前面不是用來手控來調來調去嗎現在是這邊直接打字的好同學我們把它打上10 啊這個底部呢我們用16 好存檔我的意思是說你就不用在前面這邊拉來拉去啦你看喔我現在前面就可以拉來拉去注意看喔這個拉的時候有一個那個指標有沒有看到有一個氣球好像這個是23 如果你進去到後面呢 value就是23 有沒有看到所以可以手控也可以直接打字打啊因為這個就是程式控制嘛所以我們再說這邊是16 好那我們上面這個 value這邊呢我們把它打成10 這樣你會了喔同學再講一次喔我不用從頭寫程式嗎不用因為別人已經做好了我們是利用它借力使力別人寫好的程式嘛我只要看得懂所以看懂是我要教你的最重要的事情要怎麼看懂把它區隔開一段一段看好現在第三行這裡叫做color c-o-l-o-r color background color 就是背景色然後這邊有一個警號 232323 好這個就是網頁的色彩編碼網頁的色彩編碼好你這個色彩編碼呢你只要更改它就可以了改成什麼呢來同學看喔先寫在筆記本上網頁色彩呢總共叫做 16進位 16進位喔先寫筆記喔然後呢從0到9 10個 A到F 6個所以叫16進位那必須用 RGB R要兩個顯示 G跟B兩個顯示好我現在講你不懂對不對那OK 等我喔我把開啟講義那我去開維基百科你不要動喔看我畫面就好喔然後我打上RGB 對不對我們不懂的事情就問維基百科嘛那這裡面就講RGB 就是光學色彩學劑量到最強就是白所以我們白天有光線是白色的晚上沒光就是黑的就這樣然後呢 R G B 就是三腔印象管最早的就是三腔印象管光束嘛就是光三腔印象管就是這個那我們不是LED了嗎一樣我們的色彩網頁色彩解析都以這個三個為基礎紅在前綠在中間藍在後好了那為了這個底下的理論說我們為了來編寫所以喔要讓它做出光的階層從最亮到最黑你寫起來喔二的八次方那為什麼是二因為通電跟斷電通電跟斷電就是二一個嘛一個是通電一個是斷電然後它的八次方二乘以二乘以二乘以二乘二就是二的八次方就是256色那一個紅從最亮的紅到最暗的紅總共 256個色階從零到255 好 256乘以256乘以256 三個相乘得到的就是我們的所有的色彩有沒有我講的就這個看我畫面喔二的八次方從零到255 從全黑到全白譬如說暗紅色亮紅色暗紅色粉紅色等等就是這樣子從全黑到全白就是這樣子那它就是二的八次方為什麼是二通電跟斷電八次方也就是說二乘八次好所以256乘以256 三個顏色嘛 256乘以256乘以256 得到的顏色因為我們是十六鏡位嘛得到的顏色呢就是1677萬色以前要背那個色彩色碼對不對現在不用了所以純紅色喔 RGB嘛純紅就是鏡 FF000 兩個F就是 R 後面的就是 G 中間的是G 後面的是 B RGB就是這樣排 OK 好回到這邊這一個同學你把它改成 F 00 00六個字 Value 就是值嘛啊你警號 FF 00 00六個字喔然後存檔哇你的背景就是紅色的了對不對本來是暗黑色嘛暗黑暗黑的顏色結果現在變成什麼紅色了結果剛剛我幹嘛我過去打程式嘛不用那麼麻煩啦他說欸你剛剛那麼麻煩幹嘛我的齒輪這邊喔前端控制喔就有一個Background Color 在這邊按下去就有色票啦你在這邊直接選啊你看就改啦啊你改了顏色到色票這邊你看這邊就會45748F 幹嘛背這個因為它都在這個範圍內這個範圍叫做前端控制所以前端控制介面它讓我們喔讓我們學習者變得很方便從這裡就可以控制了好現在請你調成為你的主題色彩我的主題色彩是這個因為這一排都是我們的主題色彩上面的是標準下面的是主題色彩 OK 我們主題色彩還可以再調控喔好現在請你調好好經由我們這樣的導讀喔我們就可以更深入去理解說吼老師我本來以為那個網頁程式很難耶啊我都想放棄了沒有啦經過分析就好就是這樣子同學我舉個例子就像我們想要成功我們年輕人想要成功幹嘛老師我去參觀那個加盟展就是這樣嘛別人成功了嘛那他有模式他有模組嘛那我去加入他我投一點錢我就可以快速成功了嘛就加盟展的概念不就這樣嗎我們使用模板就是這樣的概念嘛我想要快速成功對不對但來了人家開在臺北啊你是開在揚美人家那個是幾百萬人的都市啊我們是幾十萬人的都市不一樣嘛所以你要客製化一下現在我就是在教你客製化概念就是這樣嘛啊你要懂你纔有辦法讓你的這個加盟成功概念就是這個好接下來這裡喔我們看到有一個規則到這邊你看到 title裡面看那個title image 1 image 2 image 3 image 4 image 5 欸他很好心喔來階梯狀喔那我就懂了來在你的遊標在image 5這邊屁股後面喔所以尾巴後面的大魚喔把它enter enter 隔開兩個把它enter enter 隔開兩個這樣這一堆就被我隔開原來這五個就是五張圖片你不要動喔我現在看你看一張兩張三張四張五張而且很好心他取名字叫image 就圖片嘛而且有編號喔原來是這樣那圖片的內容在這個叫value這裡欸他的圖片來自於某一個人的網站不是我們的圖喔這個圖是來自於別人的網站所以他有一個網址裡面什麼叫什麼什麼什麼jpg 他是flower 第五號這樣子編號12345 好那這樣我們就看懂了對不對好現在同學我們要把他換掉圖換掉按 save存檔回來按這邊 image12345 好按下去打開我們的實習你的生辰這邊要按瀏覽圖片這邊呢就是到你的生辰的內容 ok 還沒有生辰的你可以用老師的在系列作品這邊這個是我們的藝術展覽這一項好那我生辰的時候有生辰水平跟正方形就是16P9 跟正方形那以這個版型來為例我要用正方形所以我拉進去第一張這樣ok 圖就換掉了好我們再講一次這裡不是按這個圖喔這裡不是按他按他沒用的因為他被控制在前端控制這裡面好我按image2 遊標在這個圖上面按一下他就彈出來了這就是我們熟悉的了好然後再打開目錄夾找到我的第二張圖好依序這樣我們把五張都換掉好那你換的時候如果都是正方形那就是全部都正方形如果是那個水平像 16P9 像他的範例是 16P9 那你就要全部都是16P9 好那我在這邊都是拉進去正方形好我這樣子我就可以順利把五張圖都換了好再按一下程式碼來看這一區這我們剛剛規劃的這五個同學你看到現在叫做 Fire 冒號三條斜線有沒有看到表示說這裡是我的我的暫存的圖了 OK 好那因為我們還沒有發佈所以他這個是 Fire冒號三條斜線現在喔我要把他發佈發佈到我們的本地的裡面 mywebsite 001 好我要取得這個路徑在這邊我貼上然後我按發佈好剛剛沒有發佈所以他是來自於暫存那我們現在來看一下說發佈了之後他的圖是來自於哪裡本來他的sample 是來自於網路嘛所以對方網路如果把網路關了你就沒了你的圖就沒了好我們現在是發佈到自己的選項點那因為我們操作這個案例圖很多所以我們發佈的時間會比較長一點那我們就要等他一下基本上我們已經能夠順利把這五張圖片都換圖好那我們再說一次以現在編寫網頁來說從頭自己編不會彰顯你比較強就像汽車人家都造得很好的你幹嘛自己去打造一臺汽車不用嘛買了就好了對不對你賺錢來買一臺車子就好了不用自己在那邊從頭生產鋼材然後做輪胎自己在那邊做不用網頁一樣概念這樣子你看別的東西慢慢已經變成我的了為什麼圖不一樣我要用的是強烈的網頁的動畫互動網路很少見對不對你每天看到的那些什麼電子新聞網站上面都沒有這麼強烈的互動都沒有我現在已經慢慢有一點型了我已經第一個能力能夠把照片上上去但可惜的是它的版型只有五個它只有五張圖然後呢我的客戶說它要六個七個八個九個十個二十個哇那麼多怎麼辦對不對老師它只有五個我連六個都還不會你們七個八個怎麼辦對如果我能夠突破那個瓶頸我能做出第六個那第七第八第九我就OK了好現在老師就要引導你來突破那個瓶頸進階成為我們能夠控制它的那這樣我們就有能力把別人的你看喔你知道高手都是什麼高手都是看看別人的就可能消化變成自己的這就是高手不然我們幹嘛去參觀人家的那個什麼畫廊啊去看畫廊看畫展啊對不對幹嘛去旅遊啊幹嘛去參訪對不對我們的政府官員就去國外參訪就是看看別人的回來變成我們的就是要這個能力好現在你看你要變這個能力幹嘛一定要進比較難的嘛就是進城市嘛現在喔我們的做法是把那個第五個你把它copy起來注意喔因為它比較長了所以你要copy到後面然後你copy 框好之後copy 好那貼在哪呢貼在它的底下就按照排列喔那我們希望稍微錯開一行啊縮進去一點有沒有錯開一行啊你遊標退進去一點然後錯開一行這樣就可以知道這一行是我們自己寫的好然後把編號改為六好注意喔這個是這裡從上面看過來喔從這樣過來之後這個沒有改這裡它們編號有不同所以我改成六還有看這一個上面也有不同喔它有編號喔 image value 一二三四五那這裡我就知道我要六 OK所以你改兩個地方這裡改成六就是把它五改成六改兩個蛤老師原來是改這樣對啊因為一樣畫葫蘆你看東西嘛看它的這個情況之後你就知道喔它是有編號的那我就編號我按照順序我就編成六好那我們就按 save儲存看會不會發生什麼事然後一二三四五稍等喔欸六有了耶你看我的控制介面喔看齒輪 image五 image六有了那我的圖是跟它一樣所以我還沒改現在把image六按圖按下去換一張別的圖換一張喔我現在來換一張這個這個是要我的第六張第六張一個女生在拍照的樣子 OK 我的第六張 OK 老師你這邊的前端控制有image六怎麼內容裡面沒看到因為還沒改完啊對不對還沒改完啊進階程式的話沒那麼簡單嘛先改一個地方我們先小看看成果了有了現在就要讓它再秀在那個畫面上因為這是控制介面有了秀在畫面上好現在進來了等於這個是前端控制我們已經搞定囉老師那秀在畫面上叫什麼程式內容啊我剛不是請你寫表皮裡面有三個嘛前端判斷跟程式內容啊前端你已經多一個出來完成了現在就是那個內容內容就在底下哇內容底下的時候我們再看一下喔同學我們來導引看喔現在請看注意看老師的畫面喔這一個英文字叫做 Container 好我們寫在筆記本寫一下喔 C-O-N-T-A-I-N-E-R 哦這個原來英文字叫做翻成中文叫做容器哦原來喔 Container 就是容器容器就像我們的我們剛不是有解釋嗎我們的網頁像水 Water 水液態嘛裝在圓形就是圓形的形狀就圓的裝在方形形狀就方的所以 Container就是容器 OK 好然後這裡有一段英文寫說手風琴它就告訴你說我這個以下所有的內容喔都叫手風琴原來是這樣子喔好那有幾個手風琴呢總共有五個所以它很好心它叫Box1 這一段叫Box2 哇老師它怎麼那麼好心對這個模板的工程那個設計師很好心開始的時候它就做好了註記而且幫你分好了而且跟你說注意看喔小於驚嘆號後面大於裡面的字變成墨綠色這個就叫做註解程式是會忽略它的是註解就是標記出來給誰給我們啦我們是後輩嘛我們是來學的它前輩做好了我們就有辦法看對不對盒子總共有五個走走走走到後面的 Box1 Box2 Box3 這裡怎麼寫Box1 這裡應該是Box4 他們自己註解錯了好這個是Box5 同學現在把Box5 框起來現在像我這樣框Box5 框好了嗎不要漏了喔注意看喔它都有那個起頭都有一條線所以你這樣可以對齊這樣到這邊這樣就多了喔這樣就是這樣子完整你不要框錯你把這個Box5 Copy 按右鍵Copy 好然後在它的屁股後面 Enter 格多一點再講一次它的屁股後面 Box5的屁股後面 Enter 然後 Ctrl CtrlV 貼上稍微隔開一點點這樣我們就知道上面是原本的這是我新貼的好接下來改那個編號我們是6嘛看到5就改6 好這邊就是一個A5 就改6 Image-5 改6 好底下這邊是內容文字內容好把第一段那個這個中文字後面加上Dash6 這個字裡面也加一個6 等一下我們儲存的時候要來看到底有沒有更改到同學我們教你的就是 Copy別人一樣畫葫蘆嘛然後貼上然後在地化就是我要增加嘛所以你要改按照編號我就是66666 改成6 好這樣子喔儲存欸我的前面有了耶多了第6個了你看 Dash6 文字Dash6 內容裡面 6 嗯代表我改成功了老師哪有改成功沒有圖啊喔原來喔這個版型喔沒那麼簡單對不對我改了哪幾個動作 1 改了前端增加了 Copy貼上然後改編號增加第6張然後呢我在那個什麼呢內容裡面程式內容裡面 Copy了貼上了改編號文字出現了喔圖不圖它沒有出現表示它不簡單啊所以我要做第三次的修改就第三個動作的修改為什麼來我現在解析給你聽喔同學看這一行你看我畫面喔它這裡寫 Class Box 空格 A6 那為什麼因為喔 A5可以出現 A6沒有 A6是我自己寫的我自己改的可是哪裡沒有A6呢樣式表喔原來喔我再複習一下你看喔改前端這是一次改這裡 Copy貼上第二次第三就是在這個樣式表這邊好請你在這樣式表上捲捲捲因為老師我看到A1了你看這一排是A1 來同學找到樣式表你把A1像我這樣子把它框起來表示你自己看到它了 A1 這裡就有A2了 A3 A4 A5 老師那我知道了找到最後那個人從最後尾巴嘛 A1 A5 框起來然後Ctrl C Copy 然後在他的屁股後面 Enter Ctrl V貼上改把5改成6 這裡喔這裡有5喔改成6 老師你怎麼知道那裡有5 你只要看到有5的就改6就對了 OK 對照上面看喔你看這個A4 這邊就是4 這邊5 這邊就是5 我這邊是A6 這邊就是要6 OK 好其他就不動了喔好來我們現在存檔哎呀我的圖終於出現了所以我改了三個動作歷經三個原來這個版型喔這麼貴這麼比較難嘛啊比較貴嘛原來就是這樣比較難嘛但我們沒有放棄嘛我們這樣歷經三個動作已經把它搞定了嘛好我們再複習一下喔再來第一個喔就是說我們在前端控制裡面 Copy貼上改成6 Image 6 內容裡面 Copy 5貼上改成6 樣式表裡面 Copy A5改成6 改成A6嘛都嘛這樣而已啊這樣子我們就成功了嘛好那問題來囉你能控制它了很恭喜你但怎麼那麼小啊那個圖片高度那麼小耶那麼窄耶能不能大一點對吼所以我們要加入美感為什麼嗯啊版型給你的時候他根本不管美感的啊他說我就是這個功能你厲害你拿去用對不對啊我們厲害啊我們已經會用了啊但我們是要做作品耶是要成品給客戶看所以這個太小了啦所以我們要把它變成大一點好因此喔我們要改下面的對不對改第四個啦哇老師這樣好累喔對所以我們要休息一下讓你消化一下喔所以我們先下課休息一下