HTML numarası girişlerinde yukarı/aşağı oklarının görünüşünü özelleştirme

Question

Kullanıcıların sayı giriş alanındaki değeri artırmasına izin vermek için bazı temel HTML öğeleriyle bağlantı kurmakla ilgileniyorum.

Bunun Javascript/JQuery yeniden bağlanması yoluyla mümkün olduğunu biliyorum, ancak bu oklarla JS olmadan etkileşim kurmak mümkün mü?

teşekkürler!

Answer 1

Evet, (webkit sadece ben varsayıyorum) olabilir:

<style> 
input[type=number] { 
    height: 30px; 
    line-height: 30px; 
    font-size: 16px; 
    padding: 0 8px; 
} 
input[type=number]::-webkit-inner-spin-button { 
    -webkit-appearance: none; 
    cursor:pointer; 
    display:block; 
    width:8px; 
    color: #333; 
    text-align:center; 
    position:relative; 
}  
input[type=number]:hover::-webkit-inner-spin-button { 
    background: #eee url('http://i.stack.imgur.com/YYySO.png') no-repeat 50% 50%; 
    width: 14px; 
    height: 14px; 
    padding: 4px; 
    position: relative; 
    right: 4px; 
    border-radius: 28px; 
} 
</style> 

<input type="number" value="0"> 

See JSFiddle method 1

See JSFiddle method 2

Reference