Веб-приложение для iPhone - тип = текст внутренней проблемы тени - PullRequest
20 голосов
/ 15 мая 2010

Я пытаюсь отключить верхнюю внутреннюю тень в поле ввода = текстовое поле, которое по умолчанию применяется iPhone. Есть идеи, как это сделать? попытался переписать -webkit-box-shadow безуспешно.

альтернативный текст http://feedsmanagement.com/example.png

ура

Ответы [ 6 ]

30 голосов
/ 15 мая 2010

Вы пытались использовать -webkit-appearance: none, а затем применить пользовательскую границу, например border: 1px solid black;

Я не могу попробовать это в данный момент.

7 голосов
/ 31 января 2011

Вы можете добавить градиент фонового изображения, чтобы удалить внутреннюю тень; background-image: -webkit-градиент (линейный, 0% 0%, 0% 100%, из (RGB (255,255,255)), к (RGB (255,255,255)));

2 голосов
/ 08 мая 2012

Я сделал фоновый градиент, и он не работает, я также нашел его вариант:

input[type='text']{
-webkit-border-radius: 0;
background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(hsla(0,0%,100%,0)), to(hsla(0,0%,100%,0)));
background-image:-webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0));
}

и это тоже не сработало: (

2 голосов
/ 23 июля 2010

Я обнаружил, что ответ Джамина был лучше на данный момент. Если я вместо этого использую метод -webkit-appearance: none, на iPad он больше не применяет мои стили фокуса (псевдокласс), когда выбрана текстовая область / ввод. Это как бы портит мой стиль, потому что текстовые области / входы, не находящиеся в фокусе, значительно подавлены.

2 голосов
/ 07 июня 2010

У меня возникла такая же проблема: я хотел отобразить вводимые текстовые поля со стилем: БЕЗ теней. Мое решение (отлично работает на iPad / iPhone) делает фоновый рисунок полностью прозрачным. Примените этот стиль к полю ввода. Мой код был:

.textBox input { границы: нет; фон: URL (../ изображений / bg_inputFix.gif); }

-Jamin

0 голосов
/ 18 июня 2013
-webkit-appearance:caret;

Следует удалить только тени на входах

...