# 資處科網頁設計2
## 網頁設計 創意實作:smile:
孫詩璇
[](https:// "title")
# ==教學筆記==
https://hackmd.io/@iamfefe/H1HisJiJj
---
## 心得：
第一次接觸網頁設計就覺得很有趣很好玩，就覺得沒有選錯組，就是我想要的資料處理科，在這學期接觸網頁設計之後我覺得網頁設計就是我以後想要走的路線，這學期的剛開始學網頁設計覺得很簡單，到之後寫網頁的時候就覺得很困難，雖然網頁設計跟高一開始學到的程式設計完全不一樣，程式設計寫了很多語法都看不太懂，但網頁設計不一樣的是網頁設計的語法都是普通的英文合成，就會很容易就懂在寫甚麼程式。
---
# 網頁參考版型
https://www.free-css.com/free-css-templates
## 防抄襲對比網站
* [turnitin](https://www.turnitin.com/login_page.asp?lang=zh_tw)
### 人工智慧套件快速產生大量配音檔 大量文字轉語音
* 裝vscode
* 裝python(要用管理員模式執行)
* 裝pip
### vscode裏開啟資料夾test
打print(“hi”)然後存檔
在終端機打python test.py這行執行,就會出現hi
執行pip3 install gTTS
貼入下列程式,記得檢查輸入檔名與輸出路徑
:::warning
>from gtts import gTTS
#↓檔名記得改
with open ("sin.txt","r",encoding="utf-8") as fin:
flagA=True
c=0
while flagA:
line=fin.readline().strip()
if not line:
print("end of file")
flagA=False
else:
tts=gTTS(text=line, lang='zh')
tts.save("C:\\test\\"+str(c)+".mp3")
c+=1
#↑路徑不同的人記得改#
:::
:::success
>網頁龍岡一日遊:
工作分配:
林柏宇、孫詩璇:做網頁及修圖找文案圖片
(要記得貼資料來源)
黃章峻:做2VR少部分網頁
陳世倫:做VR
5/6把第一頁完成
5/7第二頁板型做出
5/8第二頁做完
5/9第三頁做完
5/10最後一頁/最後修改
:::
### 電子書心得
## 龍岡一日遊
心得:
:::spoiler
一開始其實我不是在他們那組,到最後做電子書時他們組員就突然把我加進去幫他們修改全部的網頁,時間很緊迫剩下最後幾天他們才要我開始幫他們修改所有的電子書,做完時候他們都很滿意,但是我覺得還是缺點甚麼,到了真正繳交作品的時候我們這組就有人出包,上傳電子書沒有用到連結跟音樂,讓我跟配音的都很崩潰。
:::
個人貢獻:頁面排版、文字、內容
電子書連結:https://reurl.cc/LN2ZvL
<iframe width="1280" height="693" src="https://www.youtube.com/embed/EWdSxK8L1dY" title="「多媒體 趣趣創學園」 Google Chrome 2023 03 23 14 19 38" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
## 體驗傳統文化滋味
心得:
:::spoiler
在這組我負責的是負責找資料跟一些美觀,我覺得這組跟龍岡一日遊那組感覺差很多,在這組我覺得我沒有自己一個人在奮鬥,在龍岡那組很常我在做時去跟組員講,只有一個組員會跟我一起做,其他人的回覆總是說沒空不然就是不要我懶,我就會覺得真的沒有對比沒有傷害,但在體驗傳統文化滋味這組我覺得就真的是小組一起注重這個比賽。
:::
個人貢獻:文字、一些設計
電子書連結:https://reurl.cc/3OkZGM
<iframe width="1280" height="693" src="https://www.youtube.com/embed/D_DbAawObpg" title="「體驗 傳統文化的滋味 趣趣創學園」" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
<iframe width="100%" height="640" frameborder="0" allow="xr-spatial-tracking; gyroscope; accelerometer" allowfullscreen scrolling="no" src="https://kuula.co/share/5NVPC?logo=1&info=1&fs=1&vr=0&sd=1&thumbs=1"></iframe>
:::warning
```
<!DOCTYPE html>
<div class="modal fade" id="BookingModal" tabindex="-1" aria-labelledby="BookingModal" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-xl">
<div class="modal-content">
<div class="modal-header">
<div class="modal-body d-flex flex-column justify-content-center">
<div class="booking">
<form class="booking-form row" role="form" action="#" method="post">
<div class="col-lg-6 col-12">
<label for="name" class="form-label">姓名</label>
<input type="text" name="name" id="name" class="form-control" placeholder="姓名" required>
</div>
<div class="col-lg-6 col-12">
<label for="email" class="form-label">座號</label>
<input type="text" name="name" id="name" class="form-control" placeholder="座號" required>
</div>
<div class="col-lg-6 col-12">
<label for="phone" class="form-label">密碼</label>
<input type="telephone" name="phone" id="phone" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" class="form-control"
placeholder="密碼">
</div>
<div class="col-lg-6 col-12">
<label for="phone" class="form-label">班級</label>
<select class="form-select form-control" name="time" id="time">
<option value="" selected>請選擇班級</option>
<option value="10">資二一</option>
<option value="11">資二二</option>
<option value="12">資二三</option>
:::
:::warning
<div class="col-lg-6 col-12">
<label for="phone" class="form-label">性別</label>
<input type="radio" name="123" value="男"checked="checked">
<label class="form-check-label" for="defaultCheck1">男</label>
<input type="radio" name="123" value="女">
<label class="form-check-label" for="defaultCheck1">女</label>
</div>
<div class="col-lg-6 col-12">
<label for="phone" class="form-label">疫苗</label>
<input type="checkbox" name="456" value=" 第一劑">
<label class="form-check-label" for="defaultCheck1" > 第一劑 </label>
<input type="checkbox" name="456" value="第二劑">
<label class="form-check-label" for="defaultCheck1"> 第二劑 </label>
<input type="checkbox" name="456" value="第三劑">
<label class="form-check-label" for="defaultCheck1"> 第三劑 </label>
</div>
<label for="phone" class="form-label">隱藏代碼</label>
<input type="hidden" name="" value="">
<input type="text" name="name" id="name" class="form-control" placeholder="" 隱藏代碼 required>
<div class="col-lg-6 col-12">
<input type="submit" name="" value="送出表單">
</div>
<div class="col-lg-6 col-12">
<input type="reset" name="" value="重填">
</div>
<input type="button" name=""value="說明">
:::
```
Sign in with Wallet
Connect another wallet