HTML中的下拉清單:
Html程式碼
<select> <option value ="1">Volvo</option> <option value ="2">Saab</option> <option value="3">Opel</option> <option value="4">Audi</option> </select>
其中select是顯示一個下拉列表(drop down list)出來,option是下拉列表中的項目(item),而option的文本內容(text content)是下拉列表項目中顯示到頁面上的值,value是真正需要提交到服務端的值。
顯示效果如下:
更複雜的下拉清單:
Html程式碼
<select> <optgroup label="Swedish Cars"> <option value="1">Volvo</option> <option value="2">Saab</option> </optgroup> <optgroup label="German Cars"> <option value="3">Mercedes</option> <option value="4">Audi</option> </optgroup> </select>
#這個下拉清單包含一個「專案群組」(item group),這個群組是無法選擇的,使用label標籤標記字面內容,真正起作用的,還是value屬性。
看看這個包含「專案群組」的下拉清單
#
option中的參數:selected ="selected"
如果需要開啟頁面就預設選取某個option,則需要用到selected參數:
Html程式碼
#<select> <option value="1">Volvo</option> <option value="2">Saab</option> <option value="3" selected="selected">Mercedes</option> <option value="4">Audi</option> </select>
option中的參數:disabled="disabled"
如果需要停用某個項目,但是卻又不想隱藏,可以使用disabled屬性
#Html程式碼
<select> <option value="1">Volvo</option> <option value="2">Saab</option> <option value="3" disabled="disabled">Mercedes</option> <option value="4">Audi</option> </select>
option中的參數:title
如果需要在滑鼠放到某個項目上時,給提示,可以使用title屬性
Html程式碼
<select> <option value="1">Volvo</option> <option value="2">Saab</option> <option value="3">Mercedes</option> <option value="4" title="Audi, your best choice!">Audi</option> </select>
#其實,title也可以用在很多其他的HTML標籤中!
以上是html中關於下拉式清單select的圖文程式碼詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!