Understandng CSS Clip Property
Miksi haluan ymmärtää tämän??? ... Humm!!
Useimmat CSS kirjoittajat samaa mieltä siitä, että CSS Clip omaisuus on luultavasti yksi kaikkein un käytettyjä CSS-ominaisuuksia. Se oli niin totta minullekin ja oli erittäin iloinen jättää huomiotta sitä, kunnes aloitin muokkaamalla MooTools KAKSI Knob (Pin) Slider Komponentti (Alueen Indicator) .
Oli hyvä ehdotus yhdestä komponentin käyttäjät voivat muokata Slider Component käyttäen leikattu taka kuvia (vasten muuttuja leveys jako) osoittamaan liukusäädintä alue. Näin tuli minun aikani tulla hauska, mutta un-charter (minulle tietysti) vedet CSS Clip omaisuutta.
No! kuinka vaikeaa voi olla? Ei paljon ollenkaan ... Kyllä ja ei. Syntaksi käyttää CSS Clip omaisuus on melko pystyssä, mutta merkitys / usuage on vähän croocked. Kun muisti kuin minun, Everytime I istua muokata minun Slider Script ... Minulla tokeep viittaa takaisin käyttöön tämän CLIP omaisuuden muistuttaa itseäni logiikkaa, että olen luonut minun script .... Näin! ajattelin kynä alas ja toivoa muistaa se tulevaisuudessa (ja myös Niille, jotka näyttävät boggled jota CSS Clip Property)
Mitä CSS Clip tekee?
Clip on osa visuaalisia tehosteita moduulin CSS 2.1. Yksinkertaisesti sanottuna, sen tehtävänä on asettaa näkyvän ikkunan päälle esine, joka on leikattu, joten syväyspolku kuvia ja luoda pikkukuvia ilman luoda uusia tiedostoja (Olen jo laittaa tämän ominaisuuden käyttää paremmin Slider Component 
)
Käyttämällä CSS Clip ominaisuuden avulla voit luoda rajaavan käyttäen rect muodon. Kuten monet muutkin CSS-ominaisuudet (kuten margin, padding jne.) käyttäen rect vaatii neljä koordinaatit Top, Oikea, Ala, Vasen (HÄIRIÖ). Croocked luonne ominaisuus heijastaa kun otat tarkemmin miten clip laskee rajaavan alueen käyttäen nämä neljä koordinaatit (lähettää aivot heittää hetkeksi). Nyt hämmentää teitä pohja alkaa ylhäältä ja oikealla alkaa vasemmalta. . Näet mitä sanoin? .... Siksi tämä viesti ...
Tämä pieni sekaannus voi helposti kadota, tämä visuaalinen kuvaus CSS Clip / rect omaisuuden alla!!
CSS Clip Vaatimukset
Tehtävä olemme alkaneet on leikata seuraavat Pienoiskuva kuvan squarer näköinen kuva (ja myös laajakulma kuva)
 |  |
| Alkuperäinen Thumbnal / Image | Clip vaatimukset Sqaure Thumbmail |
CSS Clip Tulokset
