Ibland, när man lägger ut en webbsida, är det nödvändigt att dölja några av de element som placeras i den. Till exempel om du vill att besökaren inte ska se formuläret skicka knappar förrän alla obligatoriska fält är ifyllda. Eller om knappen inte alls är avsedd att användas av besökaren, men manuset på denna sida bör "klicka" på det.
Instruktioner
Steg 1
Använd visningsegenskapen för Cascading Style Sheets (CSS) för att stänga av eller på visningen av önskade sidelement. Enligt internationella standarder kan den här egenskapen tilldelas mer än ett och ett halvt dussin värden som anger olika visningsmetoder. Men endast fyra är webbläsare (dvs. fungerar i alla större webbläsare). Bland dessa fyra finns det inget värde du behöver, vilket gör att du kan dölja önskat sidelement.
Steg 2
Skapa den nödvändiga uppsättningen CSS-riktlinjer. I sin enklaste form kan det se ut så här: knapp {display: none;} I det här fallet kommer sidan inte att visa alla knappar som använder taggen….
Steg 3
Lägg till en indikation till klassnamnet i instruktionerna om du bara vill dölja en knapp eller en specifik knappgrupp. Namnge till exempel en sådan klass HideBtns och lägg till det här namnet i CSS-uttalandet: button. HideBtns {display: none;} Lägg till klassattributet till önskad knapp i HTML-koden på sidan och tilldela det värdet HideBtns: dold knapp
Steg 4
Använd visningsegenskapen med värdet none på det överordnade elementet om du till exempel vill dölja inte bara knappen utan även andra element i webbformuläret. Formuläret anses vara "överordnad" för alla element som placeras mellan taggarna och. Till exempel:
Här placeras ett textfält och en knapp för att skicka det angivna värdet in i formuläret. Formuläret tilldelas en klass som heter HideForm, så för att dölja både inmatningsfältet och knappen måste du ändra CSS-uttalandet så här: form. HideForm {display: none;}
Steg 5
Placera den förberedda koden i exemplet ovan i rubriken på webbdokumentet (mellan taggarna och). För att berätta för besökarens webbläsare att det här är CSS-kod måste den bifogas mellan de inledande och stängande HTML-taggarna:
button. HideBtns {display: none;}
