Home  >  Article  >  Web Front-end  >  How to remove all borders of text box in css

How to remove all borders of text box in css

WBOY
WBOYOriginal
2021-12-01 15:44:014230browse

In CSS, you can use the border attribute to remove all borders of the text box. The function of this attribute is to set the border of the element. When the value of this attribute is "none", the border of the element will be removed. The syntax is: "Text element {border:none;}".

How to remove all borders of text box in css

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

How to remove all the borders of the text box in css

We can remove all the borders of the text box through the border attribute. The function of this attribute is Used to set the border of the element. When the value of this attribute is none, the border of the element will be removed.

The example is as follows:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            div{
                width:200px;
                height:100px;
                border:1px solid black;
                overflow:hidden;
            }
            .wenben{
                border:none;
            }
        </style>
    </head>
    <body>
        <div class="wenben">文本框</div><br/>
        <input type="text" value="文本框" class="wenben">
    </body>
</html>

Output result:

How to remove all borders of text box in css

(Learning video sharing: css video tutorial)

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

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn