Code Snippets To Make a Better Code

Update lagi artikel lawas! Nasib tidak ada resource keren ya begini, harus kreatif ;) Do you still remember about make screensaver effect use Css3? Pada postingan tersebut pemakaian kode lumayan banyak. Tidak lain dikarenakan penulisan kode ditujukan untuk berjalan pada semua jenis browsingan. Oleh sebab itu, untuk menjadi seorang ahli bahasa CSS harus menguasai penulisan code agar support kepada browse engine :P
Seiring dengan majunya teknologi CSS telah tercipta teknik-teknik penulisan baru dalam menuliskan CSS syntax itu sendiri. Berikut link resource yg mungkin bisa berguna untuk bekal ilmu CSS snippet & CSS3 technique.

• Code Snippets
• 30 Useful CSS Snippets for Developers
• CSS Code Snippets To Make You A Better Coder
• CSS3 And HTML5 Snippets
• Top 100 Useful And Detailed CSS3 Tutorials And Techniques
• A Collection of Handy CSS Snippets
• Popular CSS Snippets

Silahkan dibaca-baca :)
Tepat sebelum/diatas tag penutup </b:skin> masukan coba code snippet sederhana berikut

body:hover::after {
 color: #fff;
 right: 0px;
 bottom: 0px;
 padding: 10px;
 z-index: 9999;
 display:block;
 position: fixed;
 border-radius: 10px 0 0 0;
 background: rgba(0,0,0,.5);
 text-shadow: 1px 2px 3px #0F0;
 content:'Alloh Maha Melihat, All Rights Reserved!';
}

SAVE. Apa hasil yg terjadi disana? Dengan pemakaian dasar kode yg sama kita bisa membuat efek screensaver secara sederhana tentunya dengan kode CSS yg sedikit!

body::after {
 content:'';
 top: 0px;
 left: 0px;
 width:100%;
 height:100%;
 color: #fff;
 display: block;
 position: fixed;
 background: rgba(0,0,0,.1);
}
body:hover::after {
 content:'';
 pointer-events: none;
 background: transparent;
}

Itu cuma contoh simple dari kemajuan dunia CSS. Dengan melakukan penulisan syntax terkini, teknik CSS telah maju secara signifikan. Ke depannya menuntut memperbaiki cara menulis bahasa CSS kita sendiri ;)) :"> Selamat berkarya :)
Bonus...

• www.ipixel.com.sg/blog/web-design/15-websites-to-test-your-codes-online/
• collegegfx.com/useful-online-tools-to-make-javascript-development-easier/
• www.catswhocode.com/blog/super-useful-online-tools-to-make-javascript-development-easier

Happy snippet \m/