Using the browser on the IPhone to browse the Web page, the button always shows the style of the Super large corner, it seems super disgusting, but we ourselves define Border-radius as 0 can not remove the fillet, after the search found that this is the Webikt kernel browser through the private properties- Webkit-appearance sets the default style for the control.
We just set this property on the button and set it to ' None ' to cancel the browser's default style for the control.
input {-webkit-appearance:none; /*去除input默认样式*/}
There is also a magical place for this property, which can be used to invoke the default style of the display browser for various controls, with a total of the following effects (applying a Span tag to a different-webkit-appearance effect):
-webkit-appearance |
effect |
-webkit-appearance:button |
SPAN Tag |
-webkit-appearance:button-bevel |
SPAN Tag |
-webkit-appearance:caret |
SPAN Tag |
-webkit-appearance:checkbox |
SPAN Tag |
-webkit-appearance:listbox |
SPAN Tag |
-webkit-appearance:listitem |
SPAN Tag |
-webkit-appearance:menulist |
SPAN Tag |
-webkit-appearance:menulist-button |
SPAN Tag |
-webkit-appearance:menulist-text |
SPAN Tag |
-webkit-appearance:menulist-textfield |
SPAN Tag |
-webkit-appearance:push-button |
SPAN Tag |
-webkit-appearance:radio |
SPAN Tag |
-webkit-appearance:scrollbarbutton-down |
SPAN Tag |
-webkit-appearance:scrollbarbutton-left |
SPAN Tag |
-webkit-appearance:scrollbarbutton-right |
SPAN Tag |
-webkit-appearance:scrollbarbutton-up |
SPAN Tag |
-webkit-appearance:scrollbargripper-horizontal |
SPAN Tag |
-webkit-appearance:scrollbargripper-vertical |
SPAN Tag |
-webkit-appearance:scrollbarthumb-horizontal |
SPAN Tag |
-webkit-appearance:scrollbarthumb-vertical |
SPAN Tag |
-webkit-appearance:scrollbartrack-horizontal |
SPAN Tag |
-webkit-appearance:scrollbartrack-vertical |
SPAN Tag |
-webkit-appearance:searchfield |
SPAN Tag |
-webkit-appearance:searchfield-cancel-button |
SPAN Tag |
-webkit-appearance:searchfield-decoration |
SPAN Tag |
-webkit-appearance:searchfield-results-button |
SPAN Tag |
-webkit-appearance:searchfield-results-decoration |
SPAN Tag |
-webkit-appearance:slider-horizontal |
SPAN Tag |
-webkit-appearance:slider-vertical |
SPAN Tag |
-webkit-appearance:sliderthumb-horizontal |
SPAN Tag |
-webkit-appearance:sliderthumb-vertical |
SPAN Tag |
-webkit-appearance:square-button |
SPAN Tag |
-webkit-appearance:textarea |
SPAN Tag |
-webkit-appearance:textfield |
SPAN Tag |
Use CSS to remove the super-large corner default style for buttons on IPhone pages