css - 如何使用css设计选择框

Question

大家好，谁能帮助我如何使用 css 制作我的选择框，就像图片中那样。

我是网络开发的新手，谁能帮我做这种设计？

htm代码:

<select class="black" >
<option>Here is the first option</opstion>
<option>red</opstion>
<option>white</opstion>
</select>

Answer 1

.black {
    background: #444444;
    border: 1px solid #26487f;
    border-radius: 1px;
    color: #fff;
    outline: 1px solid #a5c7fe;
    padding: 6px 10px;
}

JSFiddle demo .

您还需要修复 HTML 中的错误:</opstion>应该是 </option> .