Sometimes, when laying out a web page, it is necessary to hide some of the elements placed in it. For example, if you want the visitor not to see the form submit buttons until all required fields are filled in. Or if the button is not intended to be used by the visitor at all, but the script placed on this page should "click" it.
Instructions
Step 1
Use the display property of the Cascading Style Sheets (CSS) to turn off or on the display of the desired page elements. According to international standards, this property can be assigned more than one and a half dozen values that specify different display methods. However, only four are cross-browser (i.e., work in all major browsers). Among these four, there is the none value you need, which allows you to hide the desired page element.
Step 2
Create the required set of CSS guidelines. In its simplest form, it may look like this: button {display: none;} In this case, the page will not display all buttons using the… tag.
Step 3
Add an indication to the class name in the instructions if you want to hide only one button or a specific group of buttons. For example, call this class HideBtns and add this name to the CSS statement: button. HideBtns {display: none;} Add the class attribute to the desired button in the HTML code of the page and assign it the value HideBtns: hidden button
Step 4
Apply the display property with the value none to the parent element if you want, for example, to hide not only the button, but also other elements of the web form. The form is considered the "parent" of all elements placed between the and tags. For example:
Here, a text field and a button for submitting the entered value are placed inside the form. The form is assigned to a class named HideForm, so to hide both the input field and the button, you need to change the CSS statement like this: form. HideForm {display: none;}
Step 5
Place the prepared code in the example above in the header of the web document (between the and tags). To tell the visitor's browser that this is CSS code, it must be enclosed between the opening and closing HTML style tags:
button. HideBtns {display: none;}
