How to make a Search bar in Html
Using Html and CSS
If we want to make the search bar using the Html and Internal CSS then we have to follow the steps which are given below. Using these steps, we can easily view the search bar on the web page in the browser:
Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the CSS and Html code for making a search bar.
Step 2: Now, we have to place the cursor at that point in the body tag where we want to make a search bar. And, then type the <form> tag at that point.
Step 3: Now, we have to use the <input> tag with the type attribute. And, then place the text value in the type attribute. And, then, type the placeholder and name attributes in the <input> tag.
Step 4: Now, we have to use the button tag with the type attribute. And, then place the submit value in the type attribute. And, then we have to close the </button> tag. And, at last we have to close the </form> tag.
Step 5: And then, we have to use the following code of CSS between the starting and closing of <head> tag.
Step 6: And, at last, we have to save the Html file and then run the file in the browser.Test it Now
The output of above Html code is shown in the following screenshot: