Abans de CSS - original, còmode, pràctic

Pseudo-elements i pseudo-classes CSS: abans, després, suspendre, actiu, etc. - la possibilitat real de millorar la qualitat i simplificar el lloc de l'execució, sense incloure el codi JavaScript-gestor del que és obvi, no requereixen un complex dissenys de reacció, esdeveniments elements, diàlegs i accions del visitant.

Pseudo convenient, multifuncional, tenen propietats significatives d'elecció múltiple i de les cassoles simples i complexes de dret d'autor: la forma original de cridar l'atenció, sense problemes aclarir les accions necessàries per portar un toc en el lloc correcte.

Grans perspectives Obrir URL quan s'especifiqui () en el contingut de pseudo. De fet, aquesta opció obre nous horitzons, tant en termes de descarregar res a la pàgina, i la possible activació de res enlloc

Una característica distintiva de la pseudo

Pseudo (CSS :: abans, després: :) diferent dels elements, selectors i pseudo-classes que no existien originalment en l'estructura del document. Potser, en la pràctica no és particularment important, però si tenim en compte la qüestió de col·locar el contingut en el lloc, que confia en la propietat de contingut d'alguna cosa significatiu per al motor de cerca no té sentit.

Pseudo :: abans de CSS afegir contingut a l'element, i després :: - després. El contingut pot variar de format de text simple a complex en termes de propietats de CSS, però no hi ha etiquetes HTML. Pseudo pot ser perfectament posicionat dins de l'element, que està unit a, perquè el significat d'abans i després és relatiu i mòbil. No es pot simplement especificar la posició, sinó també les mides, colors, fons, fonts, i utilitzar altres funcions de CSS.

Com pseudo la CSS, l'abans i després estan precedides pel símbol ":", però estàndard CSS3 recomana "::". Per provar un ús particular en una pàgina mai serà més que alguns navegadors o versions simplement poden no notar un pseudo particular.

Condicions generals d'ús

Mitjançant la col·locació de, per exemple, div element descrivint class = 'scElement' i el contingut de "element" a la pàgina, el que indica en la descripció de fulla d'estil CSS:

.scElement {
POSICIÓ ...;
z-index ...;
...

}

es pot aplicar un pseudo ": hover" pseudo i ":: abans" CSS:

.scElement: surar :: before {content: 'prefix'; ... de color; background-color ...;}.

A continuació, quan es passa el punter del ratolí abans de la paraula 'element' apareix la paraula 'prefix', que canviarà el color de les lletres i el fons.

variacions de contingut de pseudo

Si no s'especifica propietats pseudo, que serà el mateix que el de l'element principal - scElement. Es pot especificar l'URL, i després la propietat de contingut: url ( '/ scBox / rm-v / sc-rights.png') quan el cursor mostra la imatge en l'element. En el cas del contingut: "\ 03B1" apareix matemàtica símbol "alfa", però l'ús dels caràcters especials: "& nbsp;", " & lt;", "& laquo;", "& raquo;" i altres no - que es mostraran com és.

Permès una gran quantitat d'opcions per especificar el contingut de pseudo: "text" normal, url (), una seqüència de caràcters hexadecimals, consulteu: cometa d'obertura / tancament de cometes, o si no s'obre cometa / no-tancament de cometes, etc. Com pot ser una indicació de la posició absoluta del contingut. a través de les propietats d'estil, mitjançant l'aplicació abans, CSS col·locarà el pseudo arreu de l'element al qual està connectat.

Es pot combinar l'ús simultani d'abans i després. Per tant, col·locant l'ús de CSS abans de caràcters de contingut, pot obtenir una varietat d'efectes, combinant diferents pseudo-classes i pseudo-elements, sorprendrà al visitant, no passar al mateix temps, fins i tot un sol byte de codi JavaScript.

característiques pseudo

Per les seves denominacions adoptades caràcter ":", així com per referir-se a la pseudo, però a diferència de pseudo CSS3 generalment denotat per "::". Els navegadors que entendre-ho, perceben les dues designacions. Les llacunes en l'enregistrament no està permès, la cadena que es registra i pseudo (o única) de pseudo va registrar en conjunt:

scElement: surar :: before {content: 'prefix'; ...}

scElement: actiu: després de {content: 'sufix'; ...}

És important recordar: CSS abans de quedar-se sense el contingut del lloc. Els estils no estan relacionats amb el contingut de la pàgina. Pseudo - no és una excepció. Ells no apareixen a l'arbre DOM i indesitjable per usar-los en les seccions pertinents de la web - en el contingut, no van a obtenir.

Usant el "" i "::" amb el suport de plataformes mòbils i els navegadors moderns, però verificar el treball en les versions més grans sovint no són superflus.

El contingut de pseudo-no inclòs en el contingut del lloc. No va a veure als motors de cerca. Com utilitzar aquesta circumstància - depèn de la situació específica, però la possibilitat d'utilitzar CSS abans, així com després, de forma independent o en un complex, interessant quan el contingut és una url (). L'ús directe de la pseudo contingut com enllaços al lloc, li permetrà descarregar un arxiu, per exemple, una imatge.

Possibilitat de canviar els arxius d'estil en línia (arxius de fulls d'estil en cascada - sense excepció) no interfereix amb la forma i l'ús de pseudo ja que és convenient en un moment donat, en el lloc correcte algoritme, en funció de les accions del visitant.