enjoylyingflat的部落格

「蛤!? 再一個月就要做小專題」，OOXX….

平日晚上回家，我發現我沒辦法在回家的一個小時內寫完文章(也有可能是躺平前的前兆)，所以有些內容要延後到周末再一起寫。

天氣好冷，所以我直接放棄寫文章，跑回床上再睡兩小時。

我覺得老師教得很慢，對新手來說是友善的，但有點像以前的傳統學習方式，而這種方式在現在可能不太適合我。如果只是聽課但沒有實作，遇到真實問題時真的很容易卡住。而且，即使聽得懂，但沒有經過自己的思考，這些知識不會真正內化成自己的東西。你可能知道可以怎麼用，但在實際應用時，一定會出現問題。

所以我的想法是，我需要超前進度，然後改變上課策略，把老師的上課內容當作是一種複習，並在上課時專注於做題目和寫文章。

下午是LAB課，三個小時我都拿來看學長姐的專題影片，老師有提到的小專題會在十二月底左右開始，時間大約剩下一個月。我看過歷屆學長姐的小專題和畢業展，發現他們在UI設計和前端互動上表現得非常棒，很有水準，但在創意性和功能實踐上，許多組別的作品大多偏向基礎功能，比如購物車、身份驗證等，缺乏更多有趣或深入的延伸內容。

可能是因為時間本來就不夠(時間大概只有一個月)，或者他們的目標是完成基本功能並讓頁面呈現效果，而不是開發一個有趣的作品。

我想嘗試挑戰自己，做出心中構想的一些主題，並真正完成它，但我也擔心自己是否太樂觀，因為實際上應該會遇到很多的坑，可能也無法完全做完。

問題整理

• 為什麼 !important 會覆蓋所有其他樣式？
• 選擇器的優先級如何影響樣式的應用？
• 如何區分子選擇器與子孫選擇器？

實做練習題

• 設定一段文字，讓滑鼠移到上面時背景變成藍色。
• 使用選擇器為 HTML 的 <div> 元素內所有 <h1> 設定樣式。
• 為一個連結設定不同狀態（未點擊、已點擊、滑鼠移過、點擊）的樣式。

. 選擇器的優先級與比較

• 優先級比較：!important > Inline Style > #id > .class > tag

選擇器分數計算

• Inline Style: 1000
• ID Selector: 100
• Class/Attribute/Pseudo-class: 10
• Element/Pseudo-element: 1

CSS 選擇器種類與用法

外部樣式表 vs 內部樣式表

• 外部樣式表：<link rel="stylesheet" href="style.css">
• 內部樣式表：<style> ... </style>

行內樣式：

style="background-color: blue;"

實驗：比較行內樣式與其他選擇器的優先級。

CSS 失效原因：

• 打錯字、大小寫敏感。
• 語法錯誤（如遺漏分號）。
• 檔案路徑錯誤。
• 優先級權重不正確。
• 宣告順序問題（後面的會覆蓋前面的）。

虛擬類別 (Pseudo-class)

為什麼文章都沒有寫呢?

禮拜六的時候，我本來想說可以開始超前進度，看一些新的影片，所以打算用很久以前買的樹莓派5來看影片，但發現它打字沒有繁體中文支援。於是，我花了整個早上和下午來安裝繁體中文與重灌。我嘗試了很多模組和套件，但根據 ChatGPT 的推薦，發現都不適用。

最後，我參考了一些網路文章，安裝了新的套件並做了多次嘗試，還是不行，猜測問題可能跟瀏覽器有關。所以我換了瀏覽器，並嘗試了很多套件後，才確定可以輸入中文，但這樣我的半天時間就耗掉了，後來因為太累，我就決定睡覺了。

第一週的進度我承認遠遠落後，基礎也不夠紮實。目前雖然還沒開始實作，也沒有考試，但我個人覺得照這樣下去，可能真的會做不出專題。

到了禮拜天，我開始嘗試寫文章，但發現之前累積的新手債有點多，整理文章和回顧過去的程式碼確實有些吃力。我打算從明天開始直接動手實作，因為我覺得之前課程的問題在於，程式碼沒有提前提供。而這次情況比較好，因為這個禮拜已經上到下禮拜的課程內容，所以他們已經把程式碼放出來了。我計劃在這個禮拜把這些程式碼看過一遍，如果有可以當作問題的部分，就會直接著手實作。