CSS

現在我們會使用具有互動性的簡單漸變效果了，接著要來試著讓網頁能增添更多活力，不需要我們操作，就會自動播放動畫效果。

現在我們會使用基本的偽類選擇器做效果了，但看到變化過程一閃而過、冷冰冰的，想增添更多漸變效果，讓動態效果可以更多變化、更平滑動感，就要使用我們的 transform 與 transition 這兩個屬性。

雖然標題有點聳動，但在這個行動裝置越來越多的現在，如果沒有手機版的網頁，SEO 排名會大受影響，也等同於宣告死刑了。

偽（Pseudo）這個意思有虛幻虛無的意思，類選擇器是用來處理 DOM 操作不了選擇器，偽元素則是原本並沒有在 HTML DOM 中，是透過 CSS 創造出來的元素。

我們已經了解到基本的切版概念了，但前面所學的都是固定在網頁上，也就是之前所說正常的文檔流！而這一篇就要來學會更進階一點了佈局方法了，讓元素布局上更加奔放自由，脫離文檔流。

要來介紹大家最愛用的 Flexbox 了，以往兼容性還不太好的時候，大多都是使用表格（table）屬性來進行排版，也容易出問題，現在科技進步迅速，瀏覽器也持續跟進，~~IE 也要進入歷史了~~，只要用簡單的語法，就能安排元素在網頁上各自的位置，非常的方便好用又彈性！還不快學起來！

如同前面章節所說，一開始的標籤元素，很單調只有一行並沒有各式各樣的元素，是瀏覽器內建的樣式表賦予它該展示的樣子。所以我們可以把任何標籤變成任何你愛的樣子，當然不希望如此瞎搞！

使用標籤元素套用就像是畫草圖上底色，雖然有色彩但不細緻，這時為了能夠更精雕細琢我們的網頁，於是我們要更加精準的設定樣式，但有的選擇器必須謹慎使用，不然後面要修改就麻煩了。

人是視覺動物，當網頁架構用得差不多了，想自己安排布局，會開始想辦法把網頁變得更漂亮。