How to add color to html form border? Example of border color of html form tag

This article mainly talks about adding colors to the borders of HTML forms. You can change any color you want. There are examples to analyze for easy viewing. Next, let us take a look at this article about the borders of HTML forms. Color article

First we are talking about how to add color to the border of the form?

tag is used to collect user information. Input fields have many forms based on different type attribute values. Input fields can be text fields, checkboxes, masked text controls, radio buttons, buttons, etc.

Tip: In HTML, the tag does not have a closing tag; in XHTML, the tag must be closed correctly.

Tip: Please use the label element to define a label for a form control.

Let’s first look at an example of using HTML form borders:

<form action="form_action.asp" method="get">
  请输用户名: <input type="text" name="fname" /></br>
  重复用户名: <input type="text" name="lname" /></br>
  <input type="submit" value="提交" />
</form>

The effect displayed in the browser is:

I believe we have seen this effect many times and used it many times.

This is a border that has not been added yet. Now let’s talk about how to add a border:

Our article uses css style to set the border line, for example, add something like this Style:

<style>
form{
    border: 3px solid red;
}
</style>

The effect inside will come out. Let’s type out all the codes together:

<style>
form{
    border: 3px solid red;
}
</style>

<form action="form_action.asp" method="get">
  请输用户名: <input type="text" name="fname" /></br>
  重复用户名: <input type="text" name="lname" /></br>
  <input type="submit" value="提交" />
</form>

Now let’s take a look at the effect. Is there a 3-pixel border:

As shown in the picture, a three-pixel red border is added to wrap the form. Isn’t this code also very simple? We can use this to adjust the color of the border line. , and pixel adjustment are both available.

This article about the borders of HTML forms ends here (if you want to learn more programming knowledge, welcome to the PHP Chinese website to learn). If you have any questions, you can ask below.

【Editor's Recommendation】

How to remove the label from the ol tag in html? Summary of how to use the

tag

How to remove the dot from the ul tag in HTML? Style example analysis of HTML unordered list

The above is the detailed content of How to add color to html form border? Example of border color of html form tag. For more information, please follow other related articles on the PHP Chinese website!