Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<title>Vlastní styl šipky u dropdown menu</title> <h1>Vlastní styl šipky u dropdown menu</h1> <div class="select-cover"> <select> <option value="">První</option> <option value="">Druhá</option> <option value="">Třetí</option> </select> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
* { box-sizing: border-box; } .select-cover { width: 200px; overflow: hidden; border: 1px solid #ccc; position: relative; } .select-cover select, .select-cover option { width: 200px; appearance: none; -moz-appearance: none; -webkit-appearance: none; padding: 0 .4em; line-height: 1.5em; font-size: 100%; border: 0; } .select-cover:before { content: ""; pointer-events: none; border: 6px solid transparent; width: 0px; height: 0px; display: inline-block; position: absolute; border-top: 8px solid #da3f94; top: 50%; margin-top: -4px; right: .5em; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>