Tag: CSS

Apa yang Baru di CSS4?

Apa yang Baru di CSS4?

CSS merupakan jembatan terbaik antara web designer dan developer, meski mungkin masih banyak masalah browser compatibility, tetapi mengetahui hal baru dari CSS adalah hal yang sangat menyenangkan :mrgreen:.

Nah, di saat saya belum khatam belajar CSS3, ini udah rilis aja CSS4. Ketinggalan banget ya?

Coba langsung kita tengok saja yuk apa yang baru di CSS4 ini ;).

Selectors $E > F

Sintaks selector yang memungkinkan untuk styling dari elemen parents ($ E) berdasarkan elemen anak nya (F).

/* style the LI element */
ul > $li > p { border: 1px solid #ccc; }
$ol > li:only-child {
list-style-type: none;
}

Pada source code ul di atas, yang akan terkena style adalah elemen li bukan elemen p, sedangkan pada ol akan melakukan styling pada elemen child li yang unik. Yang menarik di sini yaitu bagaimana nanti atau berapa sering developer akan menggunakan syntax $ (selector) :D. Continue reading “Apa yang Baru di CSS4?”

Evolution of the Web

Evolution of the Web

Evolution Of The Web

The Evolution of the Web is cool, interactive visualization from the Google Chrome team (along with Hyperakt and Vizzuality) that explores the evolution of web browsers over the last 20 years.

Over time web technologies have evolved to give web developers the ability to create new generations of useful and immersive web experiences. Today’s web is a result of the ongoing efforts of an open web community that helps define these web technologies, like HTML5, CSS3 and WebGL and ensure that they’re supported in all web browsers.

The color bands in this visualization represent the interaction between web technologies and browsers, which brings to life the many powerful web apps that we use daily.

Clicking on any of the browser icons brings up a cool visual history of the window design for each version.

Google Chrome

Check it here!

*taken from FlowingData

Firefox 8 Now Available!

Firefox 8 Now Available!

Indeed there is no anything that stands out in this 8 version. The most important is to improve plugin installation, Twitter search, and customization of current  reopen tabs.

Firefox 8 Features

  • Add-ons installed by third party programs are now disabled by default
  • Added a one-time add-on selection dialog to manage previously installed add-ons
  • Added Twitter to the search bar
  • Added a preference to load tabs on demand, improving start-up time when windows are restored
  • Improved tab animations when moving, reordering, or detaching tabs
  • Improved performance and memory handling
  • Added CORS support for cross-domain textures in WebGL
  • Added support for HTML5 context menus
  • Added support for insertAdjacentHTML
  • Improved CSS hyphen support for many languages
  • Improved WebSocket support
  • Fixed several stability issues

To download it, you can go straight to firefox.com. If you want a portable one, you can go to portableapps.com.

Website untuk Membuat Kombinasi Warna

color combination

Memilih warna yang tepat merupakan hal yang sangat penting saat mendesain suatu proyek web. Sebagai contoh, CSS Juice sebagian besar menggunakan putih dan abu-abu  untuk body dan hitam untuk header dan footer. Terdapat beberapa layanan aplikasi warna online di internet untuk membantu anda menentukan kombinasi warna yang dapat memperindah hasil desain anda.

1. Color Explorer

Satu set perangkat yang termasuk didalamnya warna sepadan dan koleksi warna. Dikembangkan dengan baik dan memiliki antarmuka yang spesial.

2. Software Color Palette dari ColourLovers

Termasuk didalamnya perlengkapan foto untuk mengambil jenis warna dari suatu gambar, color picker yang canggih dan color theory wheel untuk memberikan anda inspirasi, dan anda dapat menyimpan warna-warna yang anda butuhkan.

3. Colour Lovers

Website yang dikembangkan oleh Darius A Monsef IV. Pengunjung dapat mencari, me-rating, memberikan review dan mencintai warna dengan jumlah kombinasi yang sangat luas. Mereka telah menciptakan garis warna yang memikat, dalam warna dasar yang tampil menarik di berbagai ukuran.

4. Contrast-A

Anda dapat bereksperimen dengan berbagai kombinasi warna yang bervariasi, me-review warna anda, mengakse dan menciptakan palet warna sendiri.

5. Daily Colorscheme

Dapat membantuk anda menjelajah kombinasi warna baru yang mungkin belum anda pikirkan, juga merupakan sumber inspirasi warna yang sangat bagus.

6. Adobe Kuler

Aplikasi website gratis untuk themes yang dapat memberikan inspirasi bagi desain anda. Apapun yang anda ciptakan, dengan Kuler anda dapat bereksperimen dengan cepat dengan berbagai variasi warna atau browse dari ribuan koleksinya. Continue reading “Website untuk Membuat Kombinasi Warna”

CSS 2.1, CSS 3 dan HTML 5 Help Cheat Sheets (PDF)

Sekarang, kita bisa cepat untuk melihat secara keseluruhan properti apa saja yg ada di CSS 2.1, CSS3 dan HTML 5, karena sudah disediakan cheat sheets yg mantap. Jadi bisa belajar secara keseluruhan dan maksimal :D. Selamat Menikmati!!!

The CSS 2.1 Help Sheet covers Syntax, Font, Text, Margins, Padding, Border, Position, Background, List, Media Types and Keywords. The CSS 3 Help Sheet contains code snippets for Rounded Corners, Box Shadow, Multiple Columns, Text Shadow, RGBa, Font Face (actually, not the CSS3 property, but still include for the sake of usefulness), Box Sizing, Box Resize, Outline and Gradients.

css preview
css 3 help sheet preview