目前為止，我們已經能用 Rails 做出一個 MVC 架構的簡單網頁，但是這個超陽春 Blog 實在有點太過單調了。今天就來介紹一下，要怎麼樣才能將黑底白字的簡單網頁，變成平常我們看到那些多采多姿的網站。

CSS

CSS 的全名是 Cascading Stylesheets，翻譯成「階層樣式表」，顧名思義 CSS 就是用來網頁的樣式效果的。

CSS 的組成是一條一條規則，瀏覽器會將這些規則套用在網頁上。一段簡單的 CSS 大概長這樣：

p {
  font-size: 16px;
  background-color: green;
  padding-top: 3px;
}

意思是針對 HTLM 中標記 <p> 的內容， 把裡面的字體大小設為 16 像素單位、背景顏色設為綠色、內容周圍設定 3 像素單位的空白。 大括號外面的 p 較選擇器，可以用來指定想要改變樣式的 HTML，除了用標記以外，還能用 HTML 的 class、id 等方式。大括號內的每個項目都是對於目標 HTML 的樣式描述。其他更多的描述、更詳細的介紹可以再參考這邊。

javascript

有了 HTML 作為網頁的排版架構、CSS 增加網頁的顏色樣式，我們還希望網頁能活潑一點，能和使用者更細微的互動，而不是只能點連結到下一頁、按送出按鈕等基本動作。

javascript 和 Ruby 一樣是一種程式語言，不同的是 Ruby 通常在 Server 上執行，而 javascript 通常會在瀏覽器端執行。在瀏覽器端執行，也就表示它能在我們上網時，幫我們做到很多事情。例如在輸入搜尋文字時，原本要按下送出，網頁才會回傳搜尋的結果。但 javascript 能幫忙做到我們每輸入一個字，就幫我們在背景送出一次請求給服務端，回傳常見的關鍵字給客戶端，並即時顯示下拉選單讓我們可以少打一些字直接選擇。

簡單來說，我們可以用 javascript 這個程式語言，在瀏覽器中控制 HTML，可以做動畫、更新部分網頁，能讓原本單調的網頁更有互動性，提升使用者體驗。