Xóa bóng bên trong textarea trên Mobile Safari (iPhone)

Question

Theo mặc định, có vẻ như Mobile Safari thêm bóng tối bên trong vào tất cả các trường nhập, bao gồm cả văn bản. Có cách nào để xóa nó không?

Đặc biệt xấu khi bạn có nền trắng.

Answer 1

Bằng cách thêm phong cách css này:

-webkit-appearance: none; 

Answer 2

Thiết hoặc background và border thuộc tính css của thẻ input cũng dường như để làm việc.

Hãy thử điều này:

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

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

Answer 3

Trong khi thêm CSS phong cách

-webkit-appearance: none; 

sẽ làm việc, nó được thoát khỏi tất cả mọi thứ. Bạn có thể muốn thử thay vào đó:

box-shadow: none !important; 

Bằng cách này bạn giữ mũi tên xuống.

Answer 4

Đôi khi bạn có thể có biểu định kiểu đã phá vỡ appearance: none; để có cách sửa lỗi khi điều đó xảy ra là sử dụng caret. Cách tốt nhất sẽ phải viết lại mã của bạn và tìm hiểu một phần của mã của bạn có mess lên phong cách là những gì cho none

Trước khi sử dụng carat bạn cần phải biết rằng nó có thể giúp bạn có được một số rắc rối với phong cách khác

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

LƯU Ý: Sử dụng none, caret không phải là tối ưu.

Answer 5

Đây là giải pháp dễ dàng

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