Rect CSS | expressant

2009 17 febrer 2009

Understandng la propietat Clip CSS

Per què vull entendre això?? Humm ...!!

La majoria dels escriptors CSS d'acord que la propietat CSS clip és probablement un de la majoria dels productes no utilitzats de les propietats CSS. Era tan real per a mi també, i era el més feliç d'oblidar, fins que vaig començar a modificar el Mootools DOS Perilla (Pin) de component Slider (amb indicador de la gamma) .

Hi va haver una bona suggeriment d'un dels usuaris dels components per modificar el component Slider utilitzant imatges retallades backgroud (contra una divisió d'ample variable) per indicar el rang botó lliscant. Així va arribar el temps per entrar a la diversió, però inexplorat (per a mi és clar) a les aigües de la propietat Clip CSS.

Bé! el difícil que pot ser? No gaire ... SI i NO. La sintaxi per utilitzar la propietat CSS clip és bastant vertical, però el significat / usuage és una mica croocked. Amb una memòria com la meva, cada vegada que em sento a treballar en el guió de la meva lliscant ... tinc tokeep referint a l'ús d'aquesta propietat CLIP, per recordar-me a mi mateix la lògica que he creat al meu guió .... PER TANT! creu que la ploma cap avall, amb l'esperança de recordar que el futur (i també per al benefici d'aquells que semblen atordida per la propietat CSS clip)

Què Clip CSS fer?

Clip és part del mòdul d'efectes visuals de CSS 2.1. En poques paraules, el seu treball consisteix a col · locar una finestra visible a la part superior d'un objecte que està sent tallat, per tant, retallar imatges i crear miniatures sense haver de crear utilitzant fitxers (ja he posat aquesta funció per a un millor aprofitament en el component Slider )

Ús de la propietat Clip de CSS, pot crear una retallada amb la forma rect. Igual que moltes altres propietats CSS (com el farcit, etc marge), utilitzant rect requereix quatre coordenades Superior, Inferior Dreta, Esquerra (DECISIÓ). La naturalesa croocked d'aquesta propietat reflecteix el moment en què mireu més de prop com es calcula clip de la regió de retallada, l'ús d'aquests quatre coordenades (envia el cervell en un sorteig per un temps). Ara, per confondre la part inferior s'inicia des de la part superior, i el dret s'inicia des de l'esquerra. . Veus el que et vaig dir? .... Per tant aquest post ...

Aquest poc de confusió poden desaparèixer fàcilment, amb aquesta explicació visual de la CSS Clip / rect propietat com de baix!!