问题描述:
就像文本输入框<input>样式改变一样 我要改变的是<select><option></option></select>标签下拉框的样式 另外补充一点 我不要作成模拟下拉框 不要看且麻烦(除非你有很简单的模拟下拉框~HOHO~)谢谢大家!对不起,上次我问错了地方,现在只有这6分了
解析:
例一:
<select name=select size="1" class="page_speeder_1165166956">
<option value="2" selected>yesky</option>
<option value="1">redidea</option>
</select>
查一下手册,还有好多项可以设置.
例二:
<>
<head>
<style>
.box
{
border: 1px solid #C0C0C0
width: 182px
height: 20px
clip: rect( 0px, 181px, 20px, 0px )
overflow: hidden
}
.box2
{
border: 1px solid #F4F4F4
width: 180px
height: 18px
clip: rect( 0px, 179px, 18px, 0px )
overflow: hidden
}
select
{
position: relative
left: -2px
top: -2px
width: 183px
line-height: 14pxcolor: #909993
border-style: none
border-width: 0px
}
</style>
</head>
<body>
<div class = box><div class = box2>
<select size = "1" name = "D1">
<option>内容一</option>
<option>内容二</option>
</select>
</div></div>
</body>
</>
css设置下拉列表(select)样式首先我们需要获取到这个元素的id或者是class,然后在通过给这个元素设置它的width和height等等一些样式,具体的看代码: .div1{ width:600pxheight:200pxfont-size:13px} .div select{ width:200px} .div sel...select{width: 90%
padding: 8px 0
font-size: 14px
border: none
outline: none
appearance: none
-webkit-appearance: none
-moz-appearance: none
}
div:after{
content: ""
width: 13px
height: 7px
background: url(../../../images/about/sanjiaoxing2.png) no-repeat center
-webkit-background-size: 100% 100%
background-size: 100% 100%
position: absolute
right: 20px
top: 45%
//给自定义的图标实现点击下来功能
pointer-events: none
}