Remove the default button style from the iphone and ipad to remove the highlight style:

Source: Internet
Author: User

Input[type= "button"], input[type= "Submit"], input[type= "reset"] {

-webkit-appearance:none;

}

textarea {-webkit-appearance:none;}

1, remove chrome and other browser text box default Glow border

input:focus, textarea:focus {    outlinenone;}

Remove the Highlight style:

input:focus{
-webkit-tap-highlight-color:rgba (0,0,0,0);
-webkit-user-modify:read-write-plaintext-only;
}

Of course, when the text box is loaded into focus, the borders of the text boxes under all browsers will not change in color or style, but we can set them back to our own needs, such as:

input:focus,textarea:focus {    outlinenone;    border1pxsolid#f60;}

That way, when the text box is loaded into focus, the border color turns orange, giving the user a feedback.

2. Remove the small fork behind the ie10+ browser text box

Just the following sentence is OK

input::-ms-clear {    displaynone;}

3, prohibit multi-line text box textarea drag

In this way, add properties to the multiline text box cannot be dragged and zoomed out:

textarea {    resize: none;}

Here to mention a property resize, this is the CSS3 property, for element scaling, it can take the following values:

None Default Value

Both allows horizontal and vertical scaling

Horizontal only allows horizontal scaling

Vertical only allows zooming in the vertical direction

Not only for TEXTAREA elements, for most of the elements are applicable, such as Div, and so on, not listed here, but unlike textarea, the use of the div need to add a sentence overflow:auto, that is, the effect:

div {    resize: both;    overflowauto;}

Oh, here are some things about removing the default style from the form browser.

Remove the default button style from the iphone and ipad to remove the highlight style:

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.