这个问题之前是发在了论坛上了,不过没有人看,今天看了看旧贴,还是整理出来给自己在熟悉一次.关于这个问题自己之前在论坛上一直问不出结果,之后让老板给逼了出来!有时候压力也是一种动力
Select标签如果我们只写一般的样式的话,在IE下是没有效果的,但在FF下却是看到了效果,(这个时候我总是会为FF而欢呼,^_^)
select{ width:300px; height:15px; color:#000; font-size:12px; border:1px solid #000; }
如果仅仅是这样,我们在IE下看到的效果紧紧是宽度和字体颜色的变化,其他的就不能控制.
于是我在Select外面加入了一个div,控制它的定位,然后利用overflow:hidden属性把超出的范围切掉
#box{ position:absolute; width:300px; height:15px; border:1px solid #456; overflow:hidden; } select{ position:relative; top:-2px; left:-1px; width:300px; height:15px; color:#000; font-size:12px; }
不过这样FF也会读取到这些,所有最后还要利用if ie在IE下读取这些
还有最后的一个问题是我到现在都还没有办法搞好的,就是那个箭头怎样都没有办法修改,看了很多资料,需要用到javascript控制,如果你有好的例子或者方法,请跟我说说,谢谢.
=======================================================
在这个样式中有些情况不是很乐观,这样的话option多余的部分也会给剪切掉了。
因此为了有些情况我会这样写:
#box{ width:100px; overflow:hidden; }这样它剪切的仅仅是<div id="box"></div>部分,不会把option都给剪切掉。老实说,这东西真的好难搞得非常美观。
2006.3.26修改