---
tags: 大學生體驗營 - 2021 夏季班
---
# 7/19(一) 每日任務

## 題目

更改 CSS 內的程式碼為 SCSS 的寫法
需透過 Codepen 繳交 （設定為 SCSS 模式）


CSS

.header {
  background-size: cover;
  background-position: center center;
  background-image: url(../asset/img/header_desktop.png);
  background-repeat: no-repeat;
}
.header .banner {
  min-height: 420px;
}

.header .menu-bg {
  min-height: 58px;
  background: #ff0000;
  position: relative;
}

.header .menu {
  top: 0;
}

.header .menu ul a {
  display: block;
}
.header .menu ul li{
  color: #fff;
}

.header .menu ul li a:hover {
  font-weight: bolder;
}

.header .banner-title {
  max-width: 460px;
  background: #ff0000;
  color: #fff;
}

.header .main-menu {
  background: #ff0000;
  overflow: hidden;
}
.header .main-menu a:hover {
  background: #ff0000;
}
.header .hamburger-menu {
  display: block;
  float: right;
}
.header .menu-show {
  max-height: 165px;
}
.header .block-md {
  display: block;
}

## 回報流程
1. 將答案寫在 Codepen 並複製 Codepen 連結貼至「回報區」中回報就算完成了喔～
解答及回報方式請參考下方


<!-- 參考解答：[Codepen 範例](https://codepen.io/AliceChiang/pen/abZKPgY?editors=1100)
-->

回報區
---
<!-- 0. Bingbingboom（回報範例，請使用註解回報）
Codepen：https://codepen.io/Bingbingboom/pen/LYWdQJJ
-->

<!-- 1. 焦糖
Codepen：https://codepen.io/yen-kg/pen/GRWwrpv
-->

<!-- 2. 小羊
Codepen：https://codepen.io/eqsmebaz-the-selector/pen/rNmwygM
-->

<!-- 3. 羿宣
Codepen：https://codepen.io/Ann828/pen/MWmopPw?editors=0100 -->

<!-- 4. 黃珮雯
Codepen: https://codepen.io/pwh_27/pen/mdmwWgj -->

<!-- 5.小胖
Codepen: https://codepen.io/a1073315/pen/abWwJrW -->

<!-- 6.蕭絜云
Codepen: https://codepen.io/cloudy_77/pen/BaRZRyE -->

<!-- 7.黃彩雲
Codepen: https://codepen.io/corin19/pen/rNmwmOj -->

<!--8.廖奕慈
Codepen: https://codepen.io/yiciLiao/pen/RwVgVZv?editors=1100 -->

<!-- 9.Cloudia
Codepen:https://codepen.io/hkps87/pen/dyWRWga -->

<!-- 10.JT
Codepen:https://codepen.io/jsht-the-animator/pen/BaRZRej?editors=0100 -->

<!-- 11.陳瑋崗
Codepen:https://codepen.io/weigang-chen/pen/BaRZREj -->

<!-- 12. 辰
Codepen:https://codepen.io/dnangelapril/pen/qBmjmzL
-->

<!-- 13.黃郁芳
Codepen:https://codepen.io/YuFang0323/pen/wvdeevz -->

<!-- 14.馮旻
Codepen:https://codepen.io/tboqkvhk/pen/GRmEEop?editors=0100-->

<!-- 15. Jack
Codepen: https://codepen.io/JackChen89/pen/zYwzzoM -->

<!-- 16. 小松
Codepen：https://codepen.io/120061203/pen/dyWRRVy
-->

<!-- 17. Steve
Codepen: https://codepen.io/steve5631/pen/KKmqqeR
-->

<!-- 18. 劉子瑜
Codepen: https://codepen.io/superfish195/pen/OJmgjMQ
-->

<!-- 19. Iris
Codepen:
https://codepen.io/hungyen/pen/mdmwMwp
-->

<!-- 20. 薰
Codepen: https://codepen.io/chiaoshin/pen/mdmwMqX -->

<!--21. 廖仕雅
CodePen: https://codepen.io/sophia0121/pen/YzVQemo?editors=0100
-->

<!-- 22. 謝旻臻
Codepen: https://codepen.io/julia20010828/pen/MWmoVqP?editors=0110
-->

<!-- 23. 人中
Codepen: https://codepen.io/renchong2424/pen/NWjgzpW -->

<!-- 24 劉永琦
Codepen:
https://codepen.io/wjsvypvv-the-decoder/pen/YzVQvvB -->

<!-- 25. 莊承叡
Codepen：https://codepen.io/Ray_ty39/pen/XWRaXrQ?editors=0100
-->

<!-- 26. 姚小芸
Codepen: https://codepen.io/crazzyamy/pen/JjNyGXd?editors=0100 -->

<!-- 27. Genie
Codepen: https://codepen.io/hcliii/pen/yLbogrq -->

<!-- 29. 德德
Codepen: https://codepen.io/Chiouder/pen/dyWzVYZ -->

<!-- 30. 霈楹
Codepen: https://codepen.io/nrweahgl-the-selector/pen/poPWQRN-->

<!-- 31. 陳書妤
Codepen: https://codepen.io/shuyu227/pen/wvdXPqP?editors=0100 -->