Prikaz Ne postoji - je li to što? Svojstva i uporaba

Mogu postojati slučajevi kada radite na razvoju web stranica na kojima morate sakriti određene industrije ili elemente iz jednog ili drugog razloga. Možete jednostavno izbrisati te stavke u HTML oznaci. No, ponekad je potrebno da oni ostanu u kodu, ali se iz nekog razloga ne prikazuju u prozoru preglednika. Da biste spremili stavku u HTML-u, ali da biste ga učinili nevidljivim, trebali biste pogledati CSS alate.

Kako sakriti elemente pomoću CSS-a

Postoje dva najčešća načina za sakrivanje elementa koji je u HTML kodu. Jedan od njih je korištenje svojstava prikaza ili vidljivosti. Na prvi pogled ova dva svojstva mogu izgledati isto, ali svaki od njih ima svoje osobine koje biste trebali znati. Pogledajmo pobliže razlike između vidljivosti: skrivene i prikazane: none.


Svojstvo promjene vidljivosti

Prva opcija skriva element iz preglednika, ali taj skriveni dio koda još uvijek zauzima mjesto na web stranici. Drugim riječima, čini element nevidljivim, ali i dalje ostaje na mjestu i zauzima prostor koji je zauzimao, ako je bio vidljiv. Ako stavite oznaku DIV na stranicu i koristite CSS za postavljanje njene veličine, vidljivost: skriveno svojstvo učinit će da se blok ne pojavi u prozoru preglednika, a tekst nakon njega će se ponašati kao da je taj blok još uvijek prisutan. To je zato što stavka ostaje u streamu. Svojstvo koristi rijetko i vidljivoobično s drugim postavkama. Ako primijenite i druge CSS konfiguracije, kao što je pozicioniranje, najprije ga možete upotrijebiti za skrivanje stavke, ali možete je vratiti u položaj pokazivača. To je jedna od mogućih uporaba svojstava vidljivosti, ali nije prečesto upućena njemu.

Prikaz: nijedno svojstvo i njegova uporaba u CSS-u

Za razliku od svojstva vidljivosti koja ostavlja stavku u streamu, druga CSS svojstva koja se koristi za prikrivanje elemenata omogućuje vam da sakrijete blok kao da nije , Za div, display none ne radi kao da potpuno uklanja element iz dokumenta. Ne zauzima nikakav prostor, iako u izvornom HTML kodu i dalje ostaje. Stavka se neće pojaviti na vašoj web-lokaciji i neće biti dokaza o njezinu postojanju. Uz činjenicu da će je okolni elementi smatrati praznim prostorom i pomakom, ovisno o vlastitim svojstvima. To je zato što ispada iz potoka. Ovo svojstvo može se koristiti uspješno ili ne, ovisno o namjerama katera. U svakom slučaju, ne smije se zlostavljati.

Korištenje svojstava rasporeda

Crtači često koriste zaslon: nema značajke prilikom testiranja stranice. To je obično slučaj ako neko područje treba biti skriveno neko vrijeme tako da se mogu testirati i druga područja stranice. U tom slučaju koristite zaslon: none. Važno je zapamtiti da stavku treba vratiti na stranicu prijezapravo lansiranje stranice. Činjenica je da element koji se ovim načinom briše iz potoka postaje nevidljiv tražilicama i čitačima zaslona, ​​čak i ako i dalje ostane u HTML oznaci.
U prošlosti je ova metoda korištena kako bi se utjecalo na ocjene na tražilicama. No sada se stavke koje nisu prikazane mogu označiti crvenom Google zastavom kako bi se razumjelo zašto se koristi ovaj pristup. Jedan od načina za korištenje prikaza: nitko ne stvara web-lokacije s prilagodljivim dizajnom. Prilikom pisanja koda za takve web-stranice često je potrebno stvoriti elemente koji su vidljivi samo u određenom rješenju, ali su skriveni za druge opcije. Možete koristiti display: none u CSS-u da biste sakrili ovu stavku, a zatim je ponovo omogućili. To je prihvatljivo korištenje ove imovine, jer se ne može sumnjati na instalatera u pokušaju skrivanja bilo čega kako bi se utjecalo na rangiranje na tražilicama.

Prikazivanje svojstava javascripta

Svojstvo prikaza je važno svojstvo CSS-a, ali obično koristi javascript za skrivanje i prikaz elemenata bez njihovog brisanja i ponovnog stvaranja. Da biste prebacili prikaz elementa div, možete koristiti ne samo CSS već i javascript. U ovom se slučaju koristi sljedeći kod: Druga mogućnost je korištenje knjižnice jQuery. Kao i svojstvo CSS prikaza: none za div, jQuery metoda "hide ()" također skriva odabrane elemente.dijelovi koda uopće neće biti prikazani.

Čitanje zaslona i vidljivost elemenata

Čitači zaslona, ​​takozvani "čitatelji", mijenjaju svoje ponašanje kada u sadržaju pronađu element koji je skriven prikazom: ništa. Skriveni se sadržaj, u pravilu, ne prijavljuje čitateljima ako ne sadrži atribute oznaka. Postoje situacije u kojima programeri možda žele vizualno sakriti sadržaj, ali su otvoreni za korisnike na čitaču zaslona. Na primjer, dizajn može zahtijevati dvoznamenkaste izraze kao što je "više", gdje je kontekst vizualno očigledan, ali ga korisnici čitača zaslona mogu izgubiti. Da biste zaobišli ovo, programer može učiniti sljedeće: napisati CSS c blok prikaza ili ne i dodati oznaku s opisom ove stavke.

Problemi s čitačima zaslona

Problem je u skrivanju sadržaja sa zaslona: nitko ne skriva sadržaj čitatelja s ekrana. Da biste to zaobišli, programeri su počeli pozicionirati sadržaj koristeći nekoliko metoda, na primjer, apsolutno pozicioniranje s navedenom širinom i visinom elementa i preljev svojstava: skriven. Kada u ovom slučaju koristite oznaku opisa, informacije o kontekstu se ne prikazuju na zaslonu, nego se najavljuju korisnicima čitača zaslona. Ali ako testirate web-lokaciju za dostupnost, najčešće postoje elementi koji nisu prikladno prikriveni pomoću zaslona: none property. Najčešći primjer je veza osmišljena da pomogne korisnicima na tipkovnici ičitači zaslona. Ironija je u tome što te dobre namjere odlaze i povezuju uzalud zbog korištenja prikaza: ništa.

Osnovna pravila za rješavanje pitanja dostupnosti

Zbog problema s tražilicama i različitih percepcija informacija, budite oprezni kada koristite prikaz: ništa. To ne znači da ga uopće ne smijete koristiti. Ovo svojstvo ima mnoge kvalitete koje ga čine gotovo neophodnim za neke operacije.
Evo nekih pravila koja bi trebala pomoći u određivanju kada i kako vizualno sakriti elemente:
  • Ako želite sakriti sadržaj vizualno, ali ga zadržati za čitatelje, nemojte ga koristiti za prikaz teksta: none.
  • Ako sadržaj koji skrivate može biti koristan samo korisnicima koji koriste čitače zaslona, ​​razmislite o tome da ga sakrijete. Ako se ipak odlučite sakriti, provjerite da li je vidljiva prilikom fokusiranja.
  • Ako želite privremeno sakriti nešto i prikazati ga kao rezultat interakcije korisnika, prikaz: ništa ne može biti točno ono što trebate. Važan čimbenik u ovom slučaju je da budući da brže koristite javascript kako bi sadržaj bio vidljiv promjenom vrijednosti svojstva prikaza, imajte na umu da će to biti potrebno korisnicima koji nemaju JS da ga sakriju.
  • Kod prikazivanja renderovanja sadržaja sve dolazi do spoznaje da prikaz: nitko ne skriva sadržaj od bilo koga tko koristi CSS za preglednik.

    Povezane publikacije