<style type="text/css">
<!--
.select1
{
width: 110px;
height: 18px;
overflow: hidden; /*隐藏了小三角,因为宽度为110px,而select宽度为130px*/
display:block;
}
.select2{
border: 1px solid #000;
width:130px;
display:block;
height: 18px;
overflow:hidden;
background:url(images/icons/10.gif) right top no-repeat 18px 18px; /*这里设置的是新的小图标*/
}
select
{ FONT-SIZE: 13px;
position: relative;
left: -2px;
top: -2px;
width: 130px;
color: #000;
}
-->
</style>
<div class="select2">
<div class="select1">
<select>
<option>小崔设计</option>
<option>小崔设计</option>
<option>小崔设计</option>
<option>小崔设计</option>
</select>
</div>
</div>
改变select下拉菜单右侧三角形样式的方法
最新推荐文章于 2022-10-28 11:47:26 发布
本文介绍了一种使用CSS和HTML实现自定义下拉框样式的网页设计方法。通过隐藏默认的小三角图标并用自定义图标替代,同时调整select元素的显示属性,实现了外观更加统一且美观的选择框组件。
<script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"></script>

12万+

被折叠的 条评论
为什么被折叠?



