Как удалить стрелки из ввода[type= "number"] в Opera [duplicate]

этот вопрос уже есть ответ здесь:

просто глядя, чтобы удалить эти стрелки, удобно в определенных ситуациях.

Я хотел бы сохранить осведомленность браузера о том, что контент является чисто числовым. Поэтому меняю его на input[type="text"] не является приемлемым решением.

теперь, что Opera webkit на основе, этот вопрос является dulpicate из: могу ли я скрыть поле ввода номера HTML5?

93
css forms html5 input opera

3 ответов

Я использую некоторые простые CSS, и кажется, что они удаляют их и работают нормально.

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    margin: 0; 
}

этот учебник из CSS Tricks подробно объясняет , а также показывает, как их стиль

238

эти стрелки являются частью тень дом, которые в основном являются элементами DOM на Вашей странице, которые скрыты от вас. Если вы новичок в этой идее, хорошее вступительное чтение можно посмотреть здесь.

по большей части Shadow DOM экономит наше время и хорош. Но есть случаи, как этот вопрос, где вы хотите изменить его.

вы можете изменить их в Webkit сейчас с правильными селекторами, но это еще в ранние стадии развития. Сам Shadow DOM еще не имеет унифицированных селекторов, поэтому селекторы webkit являются собственностью (и это не просто вопрос добавления -webkit, как и в других случаях).

из-за этого кажется вероятным, что Opera просто еще не удосужилась добавить это. Однако найти ресурсы о модификациях Opera Shadow DOM сложно. Несколько ненадежные интернет-источники Я нашел все говорят или предполагают, что Opera в настоящее время не поддерживает тень Манипуляций с DOM.

Я потратил немного времени, просматривая веб-сайт Opera, чтобы узнать, будет ли какое-либо упоминание об этом, а также пытаясь найти их в Dragonfly...ни поиск не везло. Из-за молчания по этому вопросу и развивающегося характера манипуляции Shadow DOM + Shadow DOM, кажется безопасным выводом, что вы просто не можете сделать это в Opera, по крайней мере сейчас.

13

нет никакой возможности.

этот вопрос в основном является дубликатом есть ли способ скрыть новые элементы управления HTML5 spinbox, показанные в Google Chrome & Opera? но, возможно, не полный дубликат, так как мотивация дается.

Если целью является "осознание браузером содержимого, являющегося чисто числовым", то вам нужно рассмотреть, что это действительно означает. Стрелки, или блесны, являются частью создания числового ввода более удобным в некоторых случаях. Другой часть проверяет, что содержимое является допустимым числом, и в браузерах, поддерживающих улучшения ввода HTML5, вы можете сделать это с помощью . Этот атрибут может также влиять на третий входной объект, а именно на тип виртуальной клавиатуры, которая может появиться.

например, если вход должен быть ровно пять цифр (например, почтовые номера могут быть в некоторых странах), то <input type="text" pattern="[0-9]{5}"> может быть адекватным. Конечно, реализация зависит от того, как это будет обрабатываемый.

8