Membuat efek khususnya pada sebuah gambar dengan menggunakan bahasa CSS memang banyak sekali. You can try search in my blog with keyword
Gue mau berbagi informasi bagi blogger yg konten blognya berkutat dengan gambar, bagaimana cara memberikan efek-efek cuamik pada gambar tanpa ribet :-O Una sudah membuatkan satu bundel CSS library dengan nama CSSgram.
effect use CSSDulu AA pernah memosting artikel dengan tema
snippet inline CSS filter for mozillaContoh simple hover effects with CSS filters. Dengan seiring berkembangnya teknologi web browser engine, maka ikut maju pula rumus-rumus kode CSS yang sudah ada!
Gue mau berbagi informasi bagi blogger yg konten blognya berkutat dengan gambar, bagaimana cara memberikan efek-efek cuamik pada gambar tanpa ribet :-O Una sudah membuatkan satu bundel CSS library dengan nama CSSgram.
Dengan menanamkan link CSS-gram ke dalam template, anda sudah bisa mendapatkan ± 21 jenis efek. Satu dari beberapa hal yg mesti diperhatikan coba lakukan test terlebih dahulu pada mesin browser kalian apakah sudah mendukung CSS Filters and CSS Blend Modes For more information, check on Can I Use. Bagaimana cara pakai & pasang si gramCSS ini!!!
Simpan link di bawah tag <head>
Link by CDN
>> una.im/CSSgram
>> arttheweb.com
Link by CDN
<link rel="stylesheet" href="https://cssgram-cssgram.netdna-ssl.com/cssgram.min.css" />
Link to work locally Download the CSSgram Library.Jika sudah terpasang, cara pemakaian tinggal menambahkan kelas untuk elemen gambar loe dengan nama filter yang ingin elo gunakan.
Sebagai contoh:<!-- HTML -->
Perhatikan tulisan
<figure class="
<img src="LINK-YOUR-IMAGE" alt="" />
</figure>
Available Classes
For use in HTML markup:- 1977:class="_1977"
- Aden:class="aden"
- Brooklyn:class="brooklyn"
- Clarendon:class="clarendon"
- Earlybird:class="earlybird"
- Gingham:class="gingham"
- Hudson:class="hudson"
- Inkwell:class="inkwell"
- Lark:class="lark"
- Lo-Fi:class="lofi"
- Mayfair:class="mayfair"
- Moon:class="moon"
- Nashville:class="nashville"
- Perpetua:class="perpetua"
- Reyes:class="reyes"
- Rise:class="rise"
- Slumber:class="slumber"
- Toaster:class="toaster"
- Walden:class="walden"
- Willow:class="willow"
- X-pro II:class="xpro2"
>> una.im/CSSgram
>> arttheweb.com
Loading... |
4 comments
DO NOT EVEN TRY ADD LINK [-X
You can use some HTML tags, such as
<b> - <i> - <a> - http://...jpg/gif/png/bmp - http://youtu.be/...