9
我在這裏使用了一個自定義的選擇/下拉菜單：https://stackoverflow.com/a/10190884/1318135純CSS選擇菜單/下拉菜單：如何製作自定義右箭頭？
這個功能很好，除了右邊的'箭頭'看起來不太好。我希望它更寬一些，外觀與本網站上的向上/向下投票箭頭相似（請看左側）。
試圖使用任何這些或其他的選擇以下，開到一個解決方案：
-Integrating的圖像轉換成HTML（無法得到它在前臺v顯示下拉）
-Location的字體具有更寬箭頭的字符（找不到一個）在CSS
- 設置背景圖片屬性（而不是顯示默認的向下箭頭）
http://jsfiddle.net/XxkSC/553/
HTML：
<label class="custom-select">
<select>
<option>Sushi</option>
<option>Blue cheese with crackers</option>
<option>Steak</option>
<option>Other</option>
</select>
</label>
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: "▼"; /* Current arrow I would like to change */
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;
}
是什麼，在它的結束串巨大？！？！ – user1318135 2012-08-03 05:57:51
base64中的圖像（可能只是圖像的路徑，但因爲它是一個小提琴，所以我用這個字符串而不是單獨的文件） – 2012-08-03 10:51:31
這是我推測的獨角獸嗎？ – Knu 2012-08-03 13:55:39