<style>
.main{
}
.main img{
border-radius:10px;
}
.main h1{
text-align: center;
border: none;
color:4B4B4B;
letter-spacing: 3px;
}
.main h6{
text-align:right;
color:#F4AA14;
font-size:18px;
}
.main code{
background-color:#FFF0D1;
padding: 8px 10px;
border-radius: 20px;
margin-right:7px;
}
.main h2{
background-color:#0B8D97;
color:#fff;
width: max-content;
padding: 7px 25px 7px 17px;
border-top-right-radius: 40px;
border-bottom-right-radius: 40px;
border-bottom: none;
margin-top:46px;
margin-bottom: 25px;
}
.main h2 img{
padding-bottom: 4px;
border-radius:0;
}
.main p,li{
font-size: 18px;
line-height: 29px;
letter-spacing: 0.15em;
color:#525252;
}
.main .result{
background-color:#0B8D97;
padding:0.8rem 1rem 1rem 1rem;
border-radius: 10px;
}
.main .result h3{
text-align:center;
color:#fff;
margin-bottom:3rem;
}
.main .result h3 img{
margin-bottom:0.5rem
}
.main .result .pic img{
border: 5px solid #FFFFFF;
}
.main .pic{
text-align:center;
width: 84%;
margin: auto;
margin-top: 2rem;
}
.pic p{
color:#fff;
text-align:left;
font-size:1.8rem;
line-height:4rem
}
</style>
<div class="main">

# 網頁技術的逆襲
###### `初階` 2 小時
##  課程目的
你知道嗎?只要打開網頁,就可以用即時通跟家裡的電器聊天!
你知道嗎?只要用門禁卡或悠遊卡,就可以控制 Youtube 影片!
你知道嗎?只要在網頁前面穿紅衣服,紅色的電燈就會亮起!
也許你覺得不可思議,但是當網頁技術開始逆襲螢幕外的世界,
只要會做網頁 ( 就算不會寫程式 ),透過 Webduino,就能輕鬆成為物聯網的高手高高手!
##  課程目標
十二月份的 Webduino 社團活動,將會帶領大家參與一場互動設計的饗宴,實際體驗「語音聲控」、「聊天室」、「影像追蹤」、「RFID」...等各種新穎的控制方法,不論是個人開發、學生專題、裝置與互動藝術創作, 透過這次的活動課程,Webduino 能讓你認識用網頁技術實現互動設計的妙方,能幫你輕鬆實現不可能的夢想,更能燃燒埋藏在你心中的創客小宇宙!透過網頁技術的超強逆襲,寫下你我極速實現創意的偉大傳奇!
##  課程內容
1. 簡介 - 網頁技術與互動設計發展的糾葛
1. 語音聲控
1. 影像追蹤
1. 即時通訊
1. 超音波互動
1. RFID ( RFID 是一種無線通訊技術,常見於悠遊卡、門禁卡 )
1. 真正的「多人」超級瑪莉
<div class="result">
###  成果展示
<div class="pic">

</div>
<div class="pic">

</div>
</div>