用css改变下拉框样式
发布网友
发布时间:2022-04-06 10:27
我来回答
共2个回答
热心网友
时间:2022-04-06 11:56
例一:
<select name="select" size="1" style="font-family:Verdana,Arial; font-size: 9pt; color: #FF0000">
<option value="2" selected>yesky.com</option>
<option value="1">redidea.net</option>
</select>
查一下手册,还有好多项可以设置.
例二:
<html>
<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: 14px; color: #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>
</html>
热心网友
时间:2022-04-06 13:14
下拉框样式可以直接通过css控制的,如下这个示例:
<style>
#demo{border:1px solid #000;}
#demo option{line-height:25px;color:#000;}
</style>
<select id="demo">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
上边这个示例中:
“#demo”是设置整个下拉框的整体样式;
"#demo option"是设置下拉框中每个选项的样式。