Folosind proprietățile CSS „display: none“

Cascading Style Sheets (CSS) permit organizarea aspectul și designul paginii web. Una dintre cele mai frecvent utilizate proprietățile și valorile sale este „display: none“.

Determinarea proprietăților

Proprietatea în sine este un multi-scop și determină tipul elementului de afișare în document. În funcție de valorile specifice paginii selectate pot fi afișate porțiunea de bloc, liniar, ca o listă de articole, ca parte a mesei, și așa mai departe. D. Astfel, datorită proprietății de „afișare“, se poate schimba tipul de bloc în document.

În ceea ce privește „valoarea proprietății display: none“ pachet, vă permite să ștergeți un element sau un bloc al documentului. În același loc sub bucata de pagină nu este rezervată, ceea ce înseamnă că se încadrează în afara fluxului. Toate elementele care sunt dincolo de „telecomanda“, pur și simplu nu-l vedea și ignora dimensiunea și poziția unității. Pentru a reveni un obiect ascuns, trebuie să vă referiți la documentul prin script-uri care schimba pur și simplu valoarea proprietăților la formatul dorit. Când se întâmplă acest format automat pagina cu noul obiect pe ea.

Diferența dintre „display-“ proprietăți și „vizibilitate“

În ciuda faptului că, ca urmare a ambelor proprietăți pentru a ascunde elementele de utilizator, principiul lor de funcționare este destul de diferit. După cum sa menționat deja mai sus, parametrul „display: none“ elimină elementul din document. Blocul cade paginii, prin urmare, nu are loc în ea. În acest caz, obiectul rămâne încă în codul HTML.

La rândul său, proprietatea „visibility: hidden“ ascunde elementul de utilizator, dar nu-l scoate din modelul de document. Astfel, pagina este rezervat un loc în acest bloc. Aceasta este, fluxul de documente va accepta și ia în considerare locația și dimensiunea unui element cu proprietatea „visibility: hidden“ exact în același mod fără ea.

Această diferență este structura organizatorică a documentului aceste două proprietăți face posibilă pentru a obține rezultatul dorit pentru afișarea corectă a paginilor.

Folosind CSS - display: none

document de pe internet există mai multe modalități de a determina proprietățile elementului. Prima afișare: Nici unul nu poate fi prescris într-un fișier separat pentru Cascading Style Sheets. Această metodă este cea mai avansată și cel mai bun, deoarece vă permite să facă toate selectorii, clasele și proprietățile lor într-un document separat. Un astfel de model vă permite să găsiți și să modificați rapid setările de pagină.

Antetul documentului

Al doilea exemplu de realizare este de a defini stiluri între titlul de tag-uri de stil de document. Eficacitatea acestei metode este mult mai puțin. Se recomandă să se aplice numai în cazuri extreme, la fel ca în prezența unui număr mare de stiluri de citire de pagini web designer se deteriorează în mod semnificativ. Și acest lucru duce la erori și încetini procesul de dezvoltare a unui document web. Această abordare este recomandată doar în cazul adăugarea etichetei la un număr mic de stiluri sau instrument de depanare.

Rețineți că, dacă acest mod de organizare stiluri în document este mai mică decât o foaie de stil de import separat, proprietățile se suprapun vor fi suprascrise de cele care sunt în corpul documentului HTML.

Bloc div. Display: none

O altă modalitate este de a adăuga direct la tag-ul „style = display: none;“ element de cod. Această abordare este adesea folosit atunci când se lucrează cu diferite cadre, scopul care - reducerea numărului de caracteristici direct în foaia de stil și a le afișa în document web. În plus, o astfel de înregistrare este de multe ori atunci când uitam „inspectori de cod“ pagina. Este important să ne amintim că, folosind această abordare, puteți schimba proprietatea și valoarea prescrisă în foaia de stil. Deci ar trebui să fie atent, ca rezultat, puteți crea probleme suplimentare pentru ei înșiși și de a petrece ceva timp pe găsirea și fixarea erorilor în codul paginii.

JavaScript

De asemenea, este demn de menționat posibilitatea apariției unor modificări ulterioare în această proprietate. Nu mai face referire la foaia de stil și codul HTML și un limbaj de scripting. Prin urmare, pentru a aplica este necesar să aibă cel puțin unele cunoștințe în acest domeniu. Pentru a elimina elementul din fluxul de documente, puteți utiliza o proprietate JavaScript „display = none“. Acesta vă permite să schimbați structura documentului, atunci când un anumit eveniment. De asemenea, prin utilizarea de script-uri pentru a dinamic ( „on the fly“) pentru a modifica proprietățile de parametri și, prin urmare, reîmprospătați vizualizarea paginii fără a fi nevoie să reîncărcați. Această abordare este utilă atunci când organizarea de meniuri drop-down, ferestre și forme modale.

SEO

În domeniul optimizării conținutului web pentru motoarele de căutare, există multe superstiții și incertitudini. Deci, mulți novice SEO ia în considerare utilizarea proprietăților „de afișare“ maniere proaste. Ei explica acest lucru prin faptul că motoarele de căutare văd conținutul ascuns, începe să ia în considerare pagina ca spam. În cuvintele lor, există o anumită logică, dar nu de mult altceva. În acest moment proprietatea obiectelor ascunse folosite suficient de des pentru a formata meniul drop-down și ascunde părți ale documentului, care nu este în prezent de interes pentru utilizator (de exemplu, atunci când selectați o categorie de alte informații se elimină). Această abordare folosește un puternic suficient de portaluri de internet (una dintre ele - „Amazon“). Astfel, antenele motoarelor de căutare nu se poate lua în considerare utilizarea proprietății „display: none“ spam.

Un alt lucru, atunci când această abordare este folosită pentru a ascunde cuvinte individuale și de caractere. În ciuda faptului că acum motorul de căutare păianjeni nu au fost încă recunoaștere perfectă a unor astfel de algoritmi „spam“ în documentele, probabilitatea ca pagina va fi prins în această, este destul de mare. Prin urmare, se recomandă utilizarea „afișajul“ proprietate este strict conform destinației lor - pentru a schimba tipul de bloc sau temporar ascunde de ochii utilizatorului.