我根据解决方案使用自定义选择/下拉菜单:
/a/10190884/1318135
这个功能很棒,只有在单击该框时才显示选项.单击右侧的“箭头”不会显示下拉选项.什么是变通方法?
HTML:
Sushi
Blue cheese with crackers
Steak
Other
CSS:
label.custom-select {
position: relative;
display: inline-block;
}
.custom-select select {
display: inline-block;
padding: 4px 3px 3px 5px;
margin: 0;
font: inherit;
outline:none; /* remove focus ring from Webkit */
line-height: 1.2;
background: #000;
color:white;
border:0;
}
/* Select arrow styling */
.custom-select:after {
content: "▼";
position: absolute;
top: 0;
right: 0;
bottom: 0;
font-size: 60%;
line-height: 30px;
padding: 0 7px;
background: #000;
color: white;
}
.no-pointer-events .custom-select:after {
content: none;
}
如果觉得《html菜单箭头 html – 纯CSS选择菜单/下拉菜单:如何制作右箭头功能?》对你有帮助,请点赞、收藏,并留下你的观点哦!