/ / Använda CSS-egenskapen "display: none"

Använd CSS-egenskapen "display: none"

Cascading Style Sheets (CSS) låter dig organisera utseendet på en webbsida. En av de vanligaste egenskaperna och värdena är "display: none".

Fastighetsdefinition

visa ingen

Egenskapen i sig är mångsidig och definierarvilken typ av element som visas i dokumentet. Beroende på det valda värdet kan ett visst avsnitt på sidan visas i block, linjärt, som listobjekt, som en del av en tabell etc. Således, tack vare "display" -egenskapen, kan du ändra typen av blocket själv i dokumentet.

När det gäller bindningsskärmen för fastighetsvärde:none ", då låter det dig ta bort ett element eller block från dokumentet. Samtidigt är det inte reserverat utrymme för denna del av sidan, det vill säga det faller ut ur strömmen. Alla element som ligger bakom" borttagen "ser helt enkelt inte det och ignorerar storleken och placeringen För att returnera ett dolt objekt måste du komma åt dokumentet genom skript som helt enkelt ändrar egenskapsvärdet till önskat format, vilket automatiskt formaterar sidan baserat på det nya objektet på den.

Skillnad mellan "display" och "synlighet" egenskaper

stil visa ingen

Trots att båda fastigheterna i slutändan gömmer sigfrån användaren, är deras arbetsprincip väsentligt annorlunda. Som nämnts ovan tar parametern "display: none" bort elementet helt från dokumentet. Blocket faller ut ur sidan och tar därmed inte plats i det. Objektet i sig förblir dock i HTML-koden som tidigare.

I sin tur "synlighet:dold "döljer elementet från användaren, men tar inte bort det från dokumentmodellen. Sidan förblir således reserverad för detta block. Det vill säga dokumentflödet kommer att uppfatta och ta hänsyn till elementets plats och storlek med egenskapen" synlighet: dold "på exakt samma sätt, såväl som utan den.

En sådan skillnad i organisationen av dokumentstrukturen genom dessa två egenskaper gör att du kan uppnå det nödvändiga resultatet för korrekt visning av sidan.

Använda CSS - display: ingen

div visar ingen

Internet-dokument låter dig användaflera alternativ för att definiera elementegenskaper. Först och främst, visa: ingen kan skrivas i en separat kaskad stilarkfil. Denna metod är den mest avancerade och korrekta, eftersom den låter dig flytta alla väljare, klasser och deras egenskaper till ett separat dokument. Denna modell gör det möjligt att snabbt hitta och ändra sidparametrar.

I dokumentets titel

Det andra alternativet är att definiera stilar ihuvudet på dokumentet mellan stiltaggarna. Effektiviteten med denna metod är mycket mindre. Vi rekommenderar att du endast använder den som en sista utväg, eftersom sidans läsbarhet av en webbdesigner avsevärt försämras med ett stort antal stilar. Detta leder till fel och saktar ner utvecklingen av ett internetdokument. Detta tillvägagångssätt rekommenderas endast när du lägger till ett litet antal stilar i den här taggen eller för felsökning av ett dokument.

Det bör komma ihåg att om denna metodOm stilorganisationen finns i dokumentet som är lägre än importen av ett separat formatark kommer de skärande egenskaperna att skrivas över av de som finns i html-dokumentets kropp.

Div block. Display: ingen

css visa ingen

Ett annat sätt är att lägga tilldirekt in i "style = display: none;" kodelementtaggen. Detta tillvägagångssätt används ofta när man arbetar med olika ramar, vars syfte är att minska antalet fastigheter direkt i stilarket och visa dem i själva internetdokumentet. Dessutom inträffar denna post ofta när "kodinspektören" visar sidan. Det är viktigt att komma ihåg att med den här metoden kan du ändra egenskapen och dess värde som skrivet i stilarket. Därför bör du vara försiktig, eftersom du i slutändan kan skapa ytterligare problem för dig själv och spendera lite tid på att hitta och åtgärda ett fel i sidkoden.

Javascript

Det är också värt att nämna tilläggetmöjligheten att ändra den här egenskapen. Det hänvisar inte längre till formatmallen och html-koden utan till skriptspråket. För att kunna använda den måste du därför ha åtminstone lite kunskap inom detta område. För att ta bort ett element från dokumentflödet kan du använda JavaScript-egenskapen "display = none". Det låter dig ändra dokumentstrukturen när en viss händelse inträffar. Tack vare användningen av skript kan du dynamiskt ("i farten") ändra egenskapsparametern och därmed uppdatera sidvyn utan att behöva ladda om den. Detta tillvägagångssätt är användbart för att organisera rullgardinsmenyer, modeller och formulär.

SEO

javascript visar ingen

Inom området för optimering av webbinnehåll för sökmotorermaskin finns det många vidskepelser och tvetydigheter. Till exempel överväger många blivande SEO-användare att använda "display" -egenskapen dåliga sätt. De förklarar detta genom att sökmotorer, när de ser dolt innehåll, börjar betrakta sidan som skräppost. Det finns en logik i deras ord, men inget mer. Vid denna tidpunkt används egenskapen att dölja ett objekt ganska ofta för att formatera rullgardinsmenyer och dölja delar av dokumentet som för närvarande inte är av intresse för användaren (till exempel när en kategori väljs raderas information om andra). Detta tillvägagångssätt används av ganska kraftfulla internetportaler (en av dem är "Amazon"). Sökmotors sökrobotar kan alltså inte överväga att använda egenskapen "display: none" som skräppost.

Det är en annan fråga när detta tillvägagångssätt används fördölja enskilda ord och symboler. Trots att sökrobotar ännu inte har perfekta algoritmer för att känna igen sådan "skräppost" i dokument, är sannolikheten att sidan kommer att fångas på detta ganska hög. Därför rekommenderas att du använder egenskapen "display" strikt för det avsedda ändamålet - för att ändra blocktypen eller tillfälligt dölja den från användarens ögon.

gillade:
0
Populära inlägg
Andlig utveckling
mat
y