是否select
标签允许使用:after
选择器是为了在之后创建一个伪元素吗?
我在 Mac 上尝试过 Chrome、Safari 和 Firefox,但似乎不起作用。
这是我使用过的折衷方案。http://jsfiddle.net/pht9d295/3/ http://jsfiddle.net/pht9d295/3/
body {
background-color: #f6f6f6;
padding: 10px;
}
.select-wrapper {
background-color: #FFF;
display: inline-block;
position: relative;
}
.select-wrapper:after {
content: "\f078";
font-family: 'FontAwesome';
position: absolute;
top: 13px;
right: 10px;
z-index: 5;
pointer-events: none;
}
select {
padding: 10px 40px 10px 10px;
-webkit-appearance: none;
-ms-appearance: none;
-moz-appearance: none;
appearance: none;
border: 1px solid #bbb;
background-color: transparent;
border-radius: 0;
position: relative;
cursor: pointer;
z-index: 10;
}
<div class="select-wrapper">
<select>
<option>United Kingdom</option>
<option>Canada</option>
<option>United States</option>
</select>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)