In this tutorial, we are going to learn how to change textbox outer border color using HTML CSS. As we all know that HTML(Hyper text markup language) is an standard markup language which is used for creating web pages where it defines the content and the structure of a webpage and CSS(Cascading stylesheet)is also a language which is used to style an HTML document ,whereas it translates the display and the design of the HTML elements. since both HTML and CSS are fundamental technologies used for creating and designing web pages. Combination of both HTML and CSS is an complete web page.
Example
lets see an example how to change textbox outer border color using HTML CSS, initially we need create an html file with an extension .html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Change Textbox Border Color</title>
<link rel="stylesheet" href="textbox.css">
</head>
<body>
<input type="text" class="custom-border">
</body>
</html>
Now we need to create an CSS file with an extension .css where file name textbox.css in which changes the border color of an textbox.
.custom-border {
border: 2px solid red;
padding: 5px;
border-radius: 5px;
}
Output:
The output of this textbox outer border is black color initially after applying CSS to it then it the outer border changes into red color.
Conclusion
In conclusion, we learn how to change the textbox outer border color using HTML and CSS as both are the important concepts where combination of both is an complete web page where people can create there own websites according to there wish which is user friendly and user who are new to this can easily understood and learn this language very easy as compare to others languages.