A veces, al diseñar una página web, es necesario ocultar algunos de los elementos que se colocan en ella. Por ejemplo, si desea que el visitante no vea los botones de envío del formulario hasta que se hayan completado todos los campos obligatorios. O si el botón no está destinado a ser utilizado por el visitante en absoluto, pero la secuencia de comandos colocada en esta página debe "hacer clic" en él.
Instrucciones
Paso 1
Utilice la propiedad de visualización de las hojas de estilo en cascada (CSS) para activar o desactivar la visualización de los elementos de página deseados. De acuerdo con los estándares internacionales, a esta propiedad se le pueden asignar más de una docena y media de valores que especifican diferentes métodos de visualización. Sin embargo, solo cuatro son para varios navegadores (es decir, funcionan en todos los navegadores principales). Entre estos cuatro, existe el valor none que necesita, que le permite ocultar el elemento de página deseado.
Paso 2
Cree el conjunto requerido de pautas de CSS. En su forma más simple, puede verse así: button {display: none;} En este caso, la página no mostrará todos los botones que usan la etiqueta….
Paso 3
Agregue una indicación al nombre de la clase en las instrucciones si desea ocultar solo un botón o un grupo específico de botones. Por ejemplo, nombre una clase como HideBtns y agregue este nombre a la declaración CSS: button. HideBtns {display: none;} Agregue el atributo de clase al botón deseado en el código HTML de la página y asígnele el valor HideBtns: hidden button
Paso 4
Aplique la propiedad de visualización con el valor none al elemento principal si desea, por ejemplo, ocultar no solo el botón, sino también otros elementos del formulario web. El formulario se considera el "padre" de todos los elementos colocados entre las etiquetas y. Por ejemplo:
Aquí, un campo de texto y un botón para enviar el valor ingresado se colocan dentro del formulario. El formulario se asigna a una clase llamada HideForm, por lo que para ocultar tanto el campo de entrada como el botón, debe cambiar la declaración CSS de esta manera: form. HideForm {display: none;}
Paso 5
Coloque el código preparado en el ejemplo anterior en el encabezado del documento web (entre las etiquetas y). Para decirle al navegador del visitante que se trata de código CSS, debe incluirse entre las etiquetas de estilo HTML de apertura y cierre:
button. HideBtns {display: none;}
