LOGO-WORD

  1. 以上設計, 如果是靜態排版, 那麼第一～三階段即可完成。
  2. 淡藍色區域：使用<header>標籤。
  3. 左側LOGO文字區域：使用<h1>標籤，CSS設定padding:20px。
  4. 右側導覽列區域：使用<nav>標籤，CSS設定position:absoult; 定位在右下角。
  5. 每一個按鈕：使用<a>標籤，CSS設定(1)顏色(2)padding、margin(3)去底線(4)加圓角。
  1. 如果滑鼠滑入時設計按鈕向上滑高, 那麼可設定padding-bottom:30px;
    但, 滑鼠滑入時所有的文字都會向上移動，為什麼呢？(請注重理由！)
  2. 如果使用 display:flex 那麼一切就變得單純方便了。
  3. header區域設計display:flex，設計水平分散、垂直靠下。
  4. nav區域設計display:flex，設計垂直靠下。
  5. ※※※ 得注意瀏覽器的支援 Can I use ※※※