24 Haziran 2015
minimalcoding
2422
1
CSS ile “Input type number” elementinin “spinner” özelliğini gizlemek
Html ile oluşturulmuş input elemanına number özelliğini atadığımızda Safari,Firefox ve Chrome gibi tarayıcılarda değer girişi yapılacak olan alının sağ tarafında arttırma ve eksiltme buton yapısı (Spinner) oluşmaktadır. Bu butonu gizlemek için CSS dosyamıza ekleyeceğimiz bir kaç satır kod ile gizlememiz mümkün.
CSS kod yapısı Global tanımlama
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
input[type=number]::-webkit-outer-spin-button, input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } input[type=number] { -moz-appearance:textfield; } |
CSS kod yapısı Local tanımlama
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
.local-form input[type=number]::-webkit-outer-spin-button, .local-form input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .local-form input[type=number] { -moz-appearance:textfield; } |
Nejdet Acar
Bunu da ilk defa gördüm. Ve zamanında benim de kaldırabilsem dediğim birşeydi. Teşekkürler…