How to remove focus box in css

The way to remove the focus box in css is to add the style [input{outline:none}] to the input box. At this point, even if we enter content in the input box, the outer frame will not have focus.

The operating environment of this article: windows10 system, css 3, thinkpad t480 computer.

Input is a very important element in HTML. It can provide user input. We need to add focused styles when inputting. But when there is focus, a border will appear, so what should we do if we want to remove the border? Let’s take a look at the specific methods below.

First create a new HTML and CSS document.

Create an input box content, here use the text in the input.

We now move the mouse into the input box. At this time, we can see that the border has focus.

input {
    outline: none;
}

At this time we add the above style to CSS and remove the border focus.

Now even if we enter content, the outer frame will not have focus.

Even if we add a border, it will not have any effect.

Related video sharing: css video tutorial

The above is the detailed content of How to remove focus box in css. For more information, please follow other related articles on the PHP Chinese website!