首先，我们来看看htmlselect下拉框样式的制作：

原来的选择下拉框其实挺方便的。直接把选项写在选项里就可以得到一个流畅的下拉框，但是原来的风格也是可悲的。

首先各大浏览器渲染出来的风格结果也是多样化的，ie下的风格就更不一样了，会根据选项位置滑动。

我们在这里用的是纯HTML，甚至不是级联样式表：

！doctypehtml

超文本标记语言

头

metharset=' UTF-8 '

script type=' js/index . js '/script

PHP中文网站标题下拉列表/标题

/head

身体

形式

p下拉列表/p

挑选

option html/选项

option PHP/选项

option python/选项

选项其他/选项

option html/选项

option PHP/选项

option python/选项

选项其他/选项

/select

/form

/body

/html

这个渲染在我点击它之后：

tuyi.png

我们已经完成了HTMLselect下拉框的制作。接下来，让我们看看HTMLselect的其他样式：

1.首先移除select本身的原始样式。

2.使用元素(div/lebal等)。)作为select的父元素。

3.在选择父元素后使用：after创建新样式。

身体

br/

selectid=' selectTravelCity ' title=' SelectTravelDestination '

Optionphp中文网站/选项

选项华盛顿DC/选项

选项天使/选项

选项芝加哥/选项

选项休斯顿/选项

选项费城/选项

选项凤凰/选项

/select

br/

br/

label id=' LBlse select '

selectid=' selectPointOfInterest ' title=' selectpointsofitness '

选项PHP中文网站/选项

可选食物饮料/选项

选项餐厅/选项

选项购物/选项

optiontaxilimo/option

选项剧院/选项

选项博物馆/选项

选项计算机/选项

/select

/label

/body

这么多，虽然不是很难，但还是需要多练习

看了上图，很容易想到这个的效果图，但我还是会给出效果图：

tuer.png

HTMLselect标签两个案例研究；

案例一：如何让html中的select不可用？

假设有一个包含多个选项的选择。因为测试的需要，应该固定为选项之一，其他不能选择。我该怎么办？如果禁用此选择，结果是您根本无法获得该值。还有别的办法吗？只读也可以选择。

回答：只要放一个选项或者在选项中加上disabled='disabled '

formid=' form 1 ' name=' form 1 ' method=' post ' action=' '

selectname='select '

选项a/选项

option disabled=' disabled ' bb/option

选项cc/选项

/select

/form

案例二：如何调整select的宽度？

回答：您可以将样式样式添加到选择标签

style . S1 { width :200 px；}/style

selectclass='s1 '

即使选项很长，也可以显示。

即使选项很长，也可以显示。

/select

这就是本文的全部内容。如果您有任何问题，请在下面提问。

本文转载自中文网站