:::
3-3-1 用AI建立發布文章的自適應表單
3-3-2 認識表單元件
-
檔案上傳的部份，
name為media[]，表示這將傳送一個多值的陣列，加入multiple屬性，表示可以多選畢竟相片可能不只一張，並可用accept屬性來篩選允許上傳的副檔名<input type="file" class="form-control" id="media" name="media[]" multiple accept=".png, .jpg, .gif, .mp4"> - 表單元件可以參考：https://bootstrap5.hexschool.com/docs/5.0/forms/form-control/
- input （一般輸入框）：
<input type="輸入框類型" class="form-control" name="輸入框name" id="輸入框ID" placeholder="提示用的佔位文字" value="預設值" /> -
textarea （大量文字框）：
<textarea class="form-control" name="輸入框name" id="輸入框ID" placeholder="提示用的佔位文字" rows="行數" > 預設值 </textarea> radio單選或checkbox多選可參考：https://bootstrap5.hexschool.com/docs/5.0/forms/checks-radios/#inlineradio單選（行內用法）預設值用checked標出<div class="form-check form-check-inline"> <input class="form-check-input" type="radio" name="輸入框name" id="輸入框1ID" value="選項值1" checked> <label class="form-check-label" for="輸入框1ID">選項文字1</label> </div> <div class="form-check form-check-inline"> <input class="form-check-input" type="radio" name="輸入框name" id="輸入框2ID" value="選項值2"> <label class="form-check-label" for="輸入框2ID">選項文字2</label> </div>checkbox多選（行內用法）預設值用checked標出，可多個，注意name要加上[]才能多選。<div class="form-check form-check-inline"> <input class="form-check-input" type="checkbox" name="輸入框name[]" id="輸入框1ID" value="選項值1" checked> <label class="form-check-label" for="輸入框1ID">選項文字1</label> </div> <div class="form-check form-check-inline"> <input class="form-check-input" type="checkbox" name="輸入框name[]" id="輸入框2ID" value="選項值2"> <label class="form-check-label" for="輸入框2ID">選項文字2</label> </div>select下拉選單基本語法（https://bootstrap5.hexschool.com/docs/5.0/forms/select/）：<select class="form-select" name="輸入框name" id="輸入框ID"> <option selected>請選擇</option> <option value="值1">選項1</option> <option value="值2">選項2</option> <option value="值3">選項3</option> <option value="值4">選項4</option> </select>
