「對了熊熊～」草莓問。
「怎麼了草莓？」
「一般來說網頁不是都會有很多圖片嗎？那應該要怎麼寫呢？」

「這個簡單，來，我們直接去查文件～」

<div>
  <img src="網址" alt="財哥" />
</div>

「首先我們來看看 src，這個屬性代表圖片的來源網址，只要正確填入合法的圖片路徑，就可以在網頁上看到這張圖片囉！」

<div>
  <img src="https://upload.cc/i1/2020/09/23/znj0DJ.jpg" alt="財哥" />
</div>

網頁上就會出現圖片了：

「原來 ... 是 ... 財哥 ... 的部分啊 ... 那 alt ... 又是 ... 什麼意思 ...」草莓問說。
＊未成年請勿嚼食檳榔，這是有訓練過的小恐龍~＊

「alt 就是替代文字，如果圖片網址因為某些因素導致無法正確載入的時候就會出現這段文字，雖然不一定要完整填寫，但基於完善的網頁設計考量，能做的都應該要努力做到喔！」

「了...解...」草莓說。

「接下來來看看連結的寫法吧。」熊熊繼續說。

<div>
  <a href="連結" target="_blank"></a>
</div>

「喔喔這是人家說的超連結對吧？」
「沒錯沒錯～ a 標籤可以讓使用者連到許多外部連結，也能讓自己的網頁內容相對豐富許多。」

「那網頁也可以放影片嗎？」草莓繼續問。
「當然可以啊，就像下面這段語法。」

<video width="400" height="600" controls>
  <source src="影片.mp4" type="video/mp4">
</video> 

「音樂也是類似的寫法喔！」

<audio controls>
  <source src="音樂.mp3" type="audio/mpeg">
</audio> 

「熊熊我還有問題想問，那像是登入或是註冊的那種，網頁語法又應該怎麼寫呢？」
「這個問題很好喔！HTML 有針對這個需求提供相對應的語法，像是下面這樣。」

<form>
  <label for="name">名字:</label><br>
  <input type="text" id="name" name="name"><br>
  <label for="email">請輸入你的 email:</label>
  <input type="email" id="email" name="email"><br>
  <input type="submit" value="註冊">
</form> 

「哇～好多新東西喔！」
「沒關係我們一個一個看～」

「因為註冊行為基本上就是送出一個表單，而 HTML 提供了 form 標籤讓我們使用，input 標籤就是輸入的意思，可以看到上面出現了三種屬性，text ，email 和 submit，id 則是代表各自的唯一性。label 的部分則是對應到其關聯的 input 標籤，方便使用者知道目前的欄位是什麼。最後一個動作就是要把表單送出，把 input 屬性指定為 submit 後就大功告成囉！」

「所以表單就是要把前端的資料送到後端對吧？」草莓追問。
「答對了！前端彙整好需要的資料之後，點擊 submit 按鈕之後，資料就會傳到後端做進一步的處理了，不管註冊成功或是失敗都是要走這樣的流程喔！」

「感覺今天學到了不少東西呢！」草莓開心地說。
「要學的還有很多呢，今天先這樣吧～」熊熊說(迫不及待掏出準備好的大包薯條)

明日待續～