Ved hjelp av egenskapene til CSS "display: none"

Cascading Style Sheets (CSS) lar deg organisere utseende og design av websiden. En av de mest brukte egenskaper og dets verdier er "display: none".

Bestemme egenskaper

Egenskapen i seg selv er en multi-formål, og bestemmer typen av fremvisningselementet i dokumentet. Avhengig av de bestemte verdier valgt side kan vises blokkavsnittet, lineært, som en liste over elementer som en del av bordet, og så videre. D. Således, på grunn av den egenskap av "DISPLAY", kan endre typen av blokken i dokumentet.

Som for bundle "verdien av eiendommen display: none", det kan du slette et element eller en blokk av dokumentet. På samme sted under stykke siden er ikke reservert, noe som betyr at det faller ut av strømmen. Alle elementer som er utenfor "remote", rett og slett ikke se det og ignorere størrelse og plassering av enheten. For å returnere et skjult objekt, må du referere til dokumentet via skript som rett og slett endre verdien av eiendommene til ønsket format. Når dette skjer automatisk formatere siden med det nye objektet på den.

Forskjellen mellom egenskapene "display" og "sikt"

Til tross for det faktum at som et resultat av begge eiendommene for å skjule elementer fra brukeren, er deres prinsippet om drift ganske annerledes. Som allerede nevnt ovenfor, parameteren "display: none" fjerner element fra dokumentet. Blokken faller ut på siden, og dermed ikke tar plass i den. I dette tilfellet er fremdeles objektet i HTML-kode.

I sin tur, eiendommen "visibility: hidden" skjuler element fra brukeren, men fjerner ikke det fra dokumentet modell. Dermed er siden reservert en plass i denne blokken. Det vil si at dokumentflyten vil akseptere og vurdere plasseringen og størrelsen på et element med eiendom "visibility: hidden" på samme måte uten det.

Denne forskjellen er organisasjonsstrukturen i dokumentet disse to egenskapene gjør det mulig å oppnå det ønskede resultatet for riktig sidevisningen.

Ved hjelp av CSS - display: none

Internett dokumentet er det flere måter å bestemme egenskapene til elementet. Den første display: none kan forskrives i en egen fil for Cascading Style Sheets. Denne metoden er den mest avanserte og beste, som det tillater deg å gjøre alle velgere, klasser og deres egenskaper i et eget dokument. En slik modell kan du raskt finne og endre sideinnstillinger.

Dokumentet header

Den andre utførelse er å definere stiler blant tittelen på dokumentet stil koder. Effektiviteten av denne metoden er mye mindre. Det anbefales å bruke kun i ekstreme tilfeller, som i nærvær av et stort antall stiler lesbarhet av websider designer forverres betydelig. Og dette fører til feil og forsinke prosessen med å utvikle et web-dokument. Denne tilnærmingen anbefales bare i tilfelle av å legge koden til et lite antall stiler eller debugging instrument.

Husk at dersom denne måten å organisere stiler i dokumentet er mindre enn et eget stilark import, vil de overlappende egenskaper bli overskrevet av de som er i kroppen av dokumentet html.

Block div. Display: none

En annen måte er å legge direkte til tag "style = display: none;" code element. Denne tilnærmingen er ofte brukt når du arbeider med ulike rammer, der formålet - å redusere antall funksjoner direkte inn i stil og vise dem i nettdokumentet. I tillegg er en slik rekord ofte når du ser "kode inspektører" side. Det er viktig å huske at bruk av denne tilnærmingen, kan du endre eiendom og verdi fastsatt i stilarket. Så du bør være forsiktig, som et resultat, kan du lage flere problemer for seg selv og bruke litt tid på å finne og fikse feil på siden koden.

Javascript

Det er også verdt å nevne muligheten for ytterligere endringer i denne egenskapen. Det refererer ikke lenger til stylesheet og html-kode og et skriptspråk. Derfor, for å søke er det nødvendig å ha minst noen kunnskap på dette området. For å fjerne elementet fra dokumentflyt, kan du bruke en Javascript-eiendom "skjerm = none". Den lar deg endre strukturen i dokumentet når en bestemt hendelse. Også ved bruk av skript til dynamisk ( "on the fly") til å endre parameter egenskaper, og derved oppdatere visningen på siden uten å måtte laste. Denne tilnærmingen er nyttig når organisere rullegardinmenyer, modale vinduer og former.

SEO

I feltet for å optimalisere webinnhold for søkemotorer, er det mange overtro og usikkerhet. Så mange nybegynnere SEO vurdere bruken av eiendommene "skjerm" dårlige manerer. De forklarer dette med at søkemotorene ser det skjulte innholdet, begynner å vurdere siden som spam. I sine ord, det er en viss logikk, men ikke mye annet. På dette tidspunkt tilhører skjulte objekter som brukes ofte nok til å formatere rullegardinmenyen og skjule deler av dokumentet, som for tiden ikke er av interesse for brukeren (for eksempel når du velger en kategori av annen informasjon slettes). Denne tilnærmingen bruker en tilstrekkelig kraftig nettportaler (ett av dem - "Amazon"). Dermed søkemotor edderkopper kan ikke vurdere bruken av eiendommen "display: none" spam.

En annen ting, når denne tilnærmingen brukes til å skjule enkelte ord og tegn. Til tross for at nå søkemotoren edderkopper ikke ennå har perfekt anerkjennelse av slike "spam" algoritmer i dokumentene, sannsynligheten for at siden vil bli fanget i dette, er ganske høy. Derfor anbefales det å bruke eiendommen "skjerm" er strengt for sitt formål - å endre typen blokk eller midlertidig skjule fra øynene til brukeren.