De vegades, quan es presenta una pàgina web, és necessari amagar alguns dels elements que hi ha col·locats. Per exemple, si voleu que el visitant no vegi els botons d’enviament del formulari fins que no s’omplin tots els camps obligatoris. O si el botó no està pensat per ser utilitzat pel visitant, però l'script ubicat en aquesta pàgina hauria de "fer-hi clic".
Instruccions
Pas 1
Utilitzeu la propietat de visualització dels fulls d'estil en cascada (CSS) per apagar o per mostrar els elements de pàgina desitjats. Segons els estàndards internacionals, a aquesta propietat se li poden assignar més d'una dotzena i mitja de valors que especifiquen diferents mètodes de visualització. Tanmateix, només quatre són navegadors creuats (és a dir, funcionen en tots els principals navegadors). Entre aquests quatre, hi ha el valor nul que necessiteu, que us permet amagar l'element de pàgina desitjat.
Pas 2
Creeu el conjunt requerit de directrius CSS. En la seva forma més senzilla, pot tenir el següent aspecte: botó {display: none;} En aquest cas, la pàgina no mostrarà tots els botons amb l'etiqueta …
Pas 3
Afegiu una indicació al nom de la classe a les instruccions si voleu amagar només un botó o un grup de botons específic. Per exemple, assigneu un nom a aquesta classe HideBtns i afegiu aquest nom a la sentència CSS: button. HideBtns {display: none;} Afegiu l'atribut class al botó desitjat al codi HTML de la pàgina i assigneu-li el valor HideBtns: hidden button
Pas 4
Apliqueu la propietat de visualització amb el valor none a l'element pare si voleu, per exemple, amagar no només el botó, sinó també altres elements del formulari web. El formulari es considera el "pare" de tots els elements situats entre les etiquetes i. Per exemple:
Aquí, un camp de text i un botó per enviar el valor introduït es col·loquen dins del formulari. El formulari s’assigna a una classe anomenada HideForm, de manera que per amagar tant el camp d’entrada com el botó, heu de canviar la sentència CSS de la següent manera: form. HideForm {display: none;}
Pas 5
Col·loqueu el codi preparat a l'exemple anterior a la capçalera del document web (entre les etiquetes i). Per dir al navegador del visitant que es tracta d'un codi CSS, cal incloure'l entre les etiquetes d'estil HTML d'obertura i de tancament:
button. HideBtns {display: none;}