Előfordul, hogy egy weboldal elkészítésekor el kell rejteni a benne elhelyezett néhány elemet. Például, ha azt szeretné, hogy a látogató ne láthassa az űrlap elküldés gombjait, amíg az összes kötelező mezőt ki nem tölti. Vagy ha a gombot egyáltalán nem a látogató használja, de az ezen az oldalon elhelyezett szkriptnek "rá kell kattintania".
Utasítás
1. lépés
A Kaszkád stíluslapok (CSS) megjelenítési tulajdonságával kapcsolhatja ki vagy be a kívánt oldalelemeket. A nemzetközi szabványok szerint ehhez a tulajdonsághoz több mint másfél tucat érték rendelhető, amelyek különböző megjelenítési módszereket határoznak meg. Azonban csak négyen vannak böngészőkön át (azaz az összes fő böngészőben működnek). E négy között nincs olyan érték, amelyre szükséged van, amely lehetővé teszi a kívánt oldalelem elrejtését.
2. lépés
Készítse el a szükséges CSS-irányelveket. A legegyszerűbb formájában a következőképpen nézhet ki: gomb {display: none;} Ebben az esetben az oldal nem jeleníti meg az összes gombot a… címkét használva.
3. lépés
Ha csak egy gombot vagy egy adott gombcsoportot szeretne elrejteni, vegye fel az utasításokba az osztály nevét. Például nevezzen el egy ilyen osztályt HideBtns, és adja hozzá ezt a nevet a CSS utasításhoz: button. HideBtns {display: none;} Adja hozzá az class attribútumot a kívánt gombra az oldal HTML-kódjában, és rendelje hozzá a HideBtns: hidden gomb értéket
4. lépés
Alkalmazza a none értékű display tulajdonságot a szülő elemre, ha például el akarja rejteni nemcsak a gombot, hanem a webes űrlap egyéb elemeit is. Az űrlapot a és tagek közé helyezett összes elem "szülőjének" tekintik. Például:
Itt egy szövegmező és egy gomb a beírt érték elküldéséhez kerül az űrlap belsejébe. Az űrlap a HideForm nevű osztályhoz van hozzárendelve, ezért a beviteli mező és a gomb elrejtéséhez a CSS-utasítást a következőképpen kell megváltoztatnia: form. HideForm {display: none;}
5. lépés
Helyezze az előkészített kódot a fenti példában a webdokumentum fejlécébe (a és a tagek közé). Ahhoz, hogy elmondja a látogató böngészőjének, hogy ez CSS kód, azt be kell zárni a nyitó és a záró HTML stílusú címkék közé:
gomb. HideBtns {display: none;}
