-Webkit-appearance: none;, null

-Webkit-appearance: none;, null

When chatting in the web group today, I found this stuff. I don't seem to know him very much, so I checked his information:

Example of copying,

-----------

Buttons in the IOS environment are beautifying, but we usually do not need these seemingly old styles when designing web apps, so it is necessary to remove them.

The following code resets these styles:

-Webkit-appearance: none;

Normally, when we write mobile web development, we will add the following CSS code to zaicommon.css:

Input [type = button] {-webkit-appearance: none; outline: none}
----------------------------
But I think it seems that he is still a bit certain, not so perfect. As follows:
-------------------------
-Webkit-appearance: none. As a result, the checkbox value cannot be obtained.

The background of this BUG is a bit complicated. It is probably a Form, which must be verified by Validation Plugin and submitted by Ajax. The result shows that in the Webkit browser, the whole page is refreshed when the form is submitted.

The final culprit was the-webkit-appearance: none attribute on the checkbox.

-Webkit-appearance removes the default element style from the webkit browser. Checkbox is directly hidden under this attribute. When you use JS to obtain the checkbox value, the Webkit browser reports a strange error. Re-assign this element-webkit-appearance: checkbox and no error will be reported.

Other form elements and other situations are not tested. This problem may occur in Chrome and Safari. It should be a problem with the Webkit engine.

--------------------------