用Css來(lái)制作一個(gè)更漂亮一些的多選列表框_Web標(biāo)準(zhǔn)教程
我認(rèn)為多選列表具有完美的功能——只需按下Ctrl鍵,同時(shí)點(diǎn)擊鼠標(biāo)從列表中選擇多個(gè)項(xiàng)目。以下是一個(gè)典型的多選列表框:
上面那個(gè)列表框的代碼如下:
<form method="get" action="">
<b>Check your favorite fast food:</b><br/>
<SELECT MULTIPLE SIZE=5 name="favorites">
<OPTION VALUE="McDonalds">McDonald's</option>
<OPTION VALUE="BurgerKing">Burger King</option>
<OPTION VALUE="Wendys">Wendy's</option>
<OPTION VALUE="JackInTheBox">Jack in the Box</option>
<OPTION VALUE="KFC">KFC</option>
<OPTION VALUE="TacoBell">Taco Bell</option>
</SELECT>
<br/><input type="submit" value="Choose">
</form>
事實(shí)上,即使你在頁(yè)面中添加了用法說(shuō)明,仍然有用戶不知道如何使用多選列表框。另外,給每個(gè)項(xiàng)目增加額外的標(biāo)題確實(shí)會(huì)有幫助,但用一個(gè)普通的多選列表框能否達(dá)到那個(gè)目的,我還不能確定。
不過(guò),我確實(shí)清楚知道,用一些CSS和一小段JavaScript,你就能生成一個(gè)更漂亮一點(diǎn)的多選列表框,并且還可以建立一個(gè)等同于普通多選列表框的URL。那樣,你就不用修改處理列表框的后端代碼——而只需要美化前端即可。
- Web標(biāo)準(zhǔn):需要正確的使用H1~ H6標(biāo)簽
- 五個(gè)WEB標(biāo)準(zhǔn)中必須注意的地方
- 做到結(jié)構(gòu)(XHTML),表現(xiàn)(CSS),行為(JavaScript)的分離
- CSS標(biāo)準(zhǔn):HTML標(biāo)簽元素的關(guān)閉
- Web標(biāo)準(zhǔn)之路 勿使用W3C廢棄的元素
- CSS布局 聲明文檔類型描述(DTD)
- DIV CSS\讓搜索引擎蜘蛛不再累
- 用XHTML+CSS創(chuàng)建基于Web標(biāo)準(zhǔn)的網(wǎng)頁(yè)
- XHTML+CSS創(chuàng)建基于Web標(biāo)準(zhǔn)的網(wǎng)站
- DIV+CSS對(duì)SEO的幫助
- 淺析什么是Web標(biāo)準(zhǔn) 及其前景
- CSSer新手寄語(yǔ):開(kāi)始標(biāo)準(zhǔn)之路
Web標(biāo)準(zhǔn)教程Rss訂閱Div+Css教程搜索
Web標(biāo)準(zhǔn)教程推薦
- css相關(guān)資源網(wǎng)站
- 學(xué)習(xí)Div+CSS從何入手技術(shù)
- WebStandards(XHTML CSS)的目的和好處是什么?
- 使用DIV之后,到什么時(shí)候才使用TABLE?
- 結(jié)構(gòu)(Structure)表現(xiàn)(Presentation)和行為(Behavior)
- 利用css的clear屬性搞定廣告文字環(huán)繞效果
- HTML4.0中的新屬性:rel
- WEB標(biāo)準(zhǔn)教程第1天:選擇什么樣的DOCTYPE
- word-wrap同word-break的區(qū)別
- 符合WEB標(biāo)準(zhǔn)的滾動(dòng)文字特效的實(shí)現(xiàn)方法
猜你也喜歡看這些
- 相關(guān)鏈接:
- 教程說(shuō)明:
Web標(biāo)準(zhǔn)教程-用Css來(lái)制作一個(gè)更漂亮一些的多選列表框
。