今天完成的事:继续编写了task10.
明天计划完成的事:把task10完成,开始task11.
遇到的问题:暂时没。
收获:去除浏览器下拉方式弄来弄去感觉不对,试了半天才做到效果。
针对select需要特别设置下,谷歌和火狐的样式居然显示起来都不一样..................
select {border: solid 1px #000;
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
background: url("bj.png") no-repeat scroll
right center transparent;
padding-right: 14px;
}
之前自己试着放入一个父div来调试,虽然失败了,但上网查发现也是可以实现的,原理是为其添加一个父容器,容器是用来覆盖小箭头的,然后为select添加一个向右的小偏移或者宽度大于父级元素。设置父级的CSS属性为超出部分不可见,即可覆盖即小箭头。然后再为父级容器添加背景图片即可。overflow:
hidden并不能隐藏下拉框的显示。
css样式:
[css] view plain copy
background:
url('yourimage') no-repeat;
width: 100px;
height: 30px;
overflow: hidden;
}
.aaaaa select {
background: transparent;
border: none;
padding-left: 10px;
width: 120px;
height: 100%;
}
评论