Usuń wewnętrzny cień Textarea w Mobile Safari (iPhone)

Domyślnie wydaje się, że Mobile Safari dodaje górny wewnętrzny cień do wszystkich pól wejściowych, w tym do obszaru tekstowego. Czy jest sposób, aby to usunąć?

Jest to szczególnie brzydkie, gdy masz białe tło.

Dodając ten styl CSS:

-webkit-appearance: none;

Dodając styl CSS

-webkit-appearance: none;

zadziała, pozbędzie się wszystkiego. Zamiast tego możesz spróbować tego:

box-shadow: none !important;

W ten sposób trzymasz strzałkę w dół.

Oto proste rozwiązanie

input[type=text] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

Czasami arkusz stylów może się zepsuć, appearance: none;więc sposobem na naprawienie tego, gdy tak się stanie, jest użycie caret. Najlepszym sposobem będzie przepisanie kodu i sprawdzenie, jaka jest jego część, aby zepsuć stylnone

Przed użyciem caretmusisz wiedzieć, że może to sprawić Ci problemy z innymi stylami

-webkit-appearance: caret;
   -moz-appearance: caret;
     -o-appearance: caret;
        appearance: caret;

UWAGA: Użycie none, caretnie jest optymalna.

https://stackoverflow.com/a/51626446/9287284

background-clip: padding-box;

i znalazłem starszy komentarz do tych samych odpowiedzi tutaj.

https://stackoverflow.com/a/29750016/9287284

Wydaje się, że ustawienie właściwości tagu albo backgroundi bordercss inputrównież działa.

Spróbuj tego:

<style>
input {
    background: #ccc;
    border: none;
}
</style>

<form>
First name: <input type="text"/><br />
Last name: <input type="text" />
</form>