L'ús de les propietats de la CSS "display: none"

Cascading Style Sheets (CSS) li permeten organitzar l'aparença i el disseny de la pàgina web. Una de les propietats més usades i els seus valors és "display: none".

Determinació de les propietats

La propietat en si és un multi-propòsit i determina el tipus d'element de visualització en el document. Depenent dels valors específics de la pàgina seleccionada es pot mostrar la part de bloc, de forma lineal, com una llista d'elements com a part de la taula, i així successivament. D. Per tant, a causa de la propietat de la "pantalla", pot canviar el tipus de bloc en el document.

Pel que fa al "valor de la propietat display: none" paquet, que li permet eliminar un element o un bloc del document. En el mateix lloc sota de la peça de pàgina no està reservat, el que significa que cau fora del corrent. Tots els elements que estan més enllà de la "distància", simplement no el van veure i ignoren la mida i la posició de la unitat. Per tornar un objecte ocult, ha de fer referència al document a través de seqüència que simplement canvien el valor de les propietats en el format desitjat. Quan això succeeix format automàticament a la pàgina amb el nou objecte a dins.

La diferència entre les propietats "pantalla" i "visibilitat"

Malgrat el fet que, com a resultat de les propietats per ocultar els elements d'usuari, el seu principi de funcionament és bastant diferent. Com ja s'ha esmentat anteriorment, el paràmetre "display: none" elimina l'element del document. El bloc es surt de la pàgina, per tant no tenen lloc en ella. En aquest cas, l'objecte roman encara en el codi HTML.

Al seu torn, la propietat "visibility: hidden" oculta l'element de l'usuari, però no l'elimina del model de document. Per tant, la pàgina està reservat un lloc en aquest bloc. És a dir, el flux de documents acceptarà i considerar la ubicació i la mida d'un element amb propietat "visibility: hidden" exactament de la mateixa manera sense.

Aquesta diferència és l'estructura d'organització del document aquestes dues propietats fa que sigui possible per aconseguir el resultat desitjat per a la visualització de la pàgina correcta.

L'ús de CSS - display: none

document a internet hi ha diverses maneres de determinar les propietats de l'element. La primera pantalla: cap pot prescriure en un arxiu separat per Cascading Style Sheets. Aquest mètode és el més avançat i la millor, ja que li permet fer tots els selectors, classes i les seves propietats en un document separat. Aquest model permet trobar de forma ràpida i modificar la configuració de pàgina.

La capçalera del document

La segona realització és definir estils entre el títol de les etiquetes d'estil document. L'eficàcia d'aquest mètode és molt menor. Es recomana aplicar només en casos extrems, com en la presència d'un gran nombre d'estils llegibilitat del dissenyador de pàgines web es deteriora de manera significativa. I això condueix a errors i alentir el procés d'elaboració d'un document web. Aquest mètode només es recomana en el cas d'afegir l'etiqueta a un petit nombre d'estils o instrument de depuració.

Recordeu que si aquesta forma d'organitzar estils en el document és menys d'una importació de full d'estil separat, les propietats superposades seran reemplaçats pels que estan en el cos del document HTML.

Bloquejar div. Display: none

Una altra forma és afegir directament a l'etiqueta "style = display: none;" element de codi. Aquest enfocament s'utilitza sovint quan es treballa amb diversos marcs, el propòsit dels quals - la reducció del nombre de característiques directament al full d'estil i mostrar-los en el document web. A més, aquest registre és sovint quan es veu "inspectors del codi" pàgina. És important recordar que l'ús d'aquest enfocament, es pot canviar la propietat i el valor establert en el full d'estil. Pel que ha de anar amb compte, com a conseqüència, pot crear problemes addicionals per a ells i passar un temps a trobar i corregir errors en el codi de la pàgina.

JavaScript

També val la pena esmentar la possibilitat de nous canvis en aquesta propietat. Ja no fa referència al full d'estil i de codi HTML i un llenguatge de script. Per tant, per aplicar-lo és necessari tenir almenys una mica de coneixement en aquesta àrea. Per tal d'eliminar l'element del flux del document, es pot utilitzar una propietat de JavaScript "display = cap". Se li permet canviar l'estructura del document quan un determinat esdeveniment. A més, mitjançant l'ús de seqüències d'ordres per dinàmicament ( "sobre la marxa") per a canviar les propietats dels paràmetres i per tant actualitzar la vista de la pàgina sense haver de recarregar. Aquest enfocament és útil en l'organització dels menús desplegables, finestres modals i formes.

SEO

En el camp de l'optimització de contingut web per als motors de cerca, hi ha moltes supersticions i incerteses. Per tant, molts novells SEO consideren l'ús de les propietats de visualització "" males maneres. En elles s'explica això pel fet que els motors de cerca que veuen el contingut ocult, comencen a considerar la pàgina com a correu brossa. En les seves paraules, hi ha certa lògica, però no gaire més. En aquest punt en el temps la propietat d'objectes ocults s'utilitza sovint suficient formateig de menú desplegable i ocultar les parts del document, que no està d'interès per a l'usuari (per exemple, quan es selecciona una categoria d'una altra informació s'esborra). Aquest enfocament utilitza uns prou potents portals d'Internet (un d'ells - el "Amazones"). D'aquesta manera, els motors de cerca no poden considerar l'ús de la propietat "display: none" correu brossa.

Una altra cosa, quan s'utilitza aquest mètode per ocultar les paraules i caràcters individuals. Malgrat el fet que ara els motors de cerca que no tenen un perfecte reconeixement de tals algoritmes de "spam" en els documents, la probabilitat que la pàgina es veurà atrapat en això, és bastant alt. Per tant, es recomana utilitzar la "pantalla" la propietat és estrictament per a la seva pretès propòsit - per canviar el tipus de bloc o temporalment amagar-se dels ulls de l'usuari.