.

9 Komentar Untuk Artikel Ini BYAdmin Ilmuwebsite

Satu atau dua tahun yang lalu mungkin anda pernah mendengar CSS versi 3 telah keluar, meskipun saat itu masih beta tapi ini menjadi kabar yang menggembirakan, karena CSS3 tidak akan dirilis jika tidak membawa banyak sekali fitur-fitur baru di dalamnya, namun saat itu baru sedikit browser internet yang mendukung CSS3 ini. Browser yang mensupport CSS baru Safari v.3, namun sekarang Firefox pada versi ke 3.6 sudah mendukung CSS3.

Bagi anda yang mungkin belum mengetahui CSS, CSS digunakan dalam pembuatan layout yang tableless, artinya pembuatan layout tidak lagi menggunakan metode table, karena dampak dari penggunaan table yang paling terasa adalah beratnya layout yang dihasilkan karena begitu banyak kode-kode dari hasil penggunaan table. Tableless pun menjadi standarisasi bagi seorang SEO-er, karena sifatnya yang search engine friendly. Tidak hanya dalam pembuatan layout, CSS3 pun efektif digunakan dalam pembuatan style-style yang mempercantik sebuah website.

Baik, disini penulis akan jabarkan fitur apa saja yang baru dalam CSS3,  CSS3 memiliki fasilitas untuk shadow dari suatu div layout, fitur transparansi, gradien warna pada border, warna pada text yang diseleksi, fitur skala memperkecil atau memperbesar layout, kolom pada text, dan fitur gradien pada background.

Terbatas hanya sampai 24 Agustus 2018 Paket Lengkap Mahir Web Development Bangun 5 (jenis) Project Website + Mahir Membuat Aplikasi Android (4 Project + Upload Playstore)

Hanya Rp 127.000 (Total 4 DVD). Dibuat oleh praktisi yang memiliki pengalaman lebih dari 10 tahun di bidang web development (Pemesanan bisa SMS/WA ke 0838 1157 5876, atau bisa pesan secara online di sini)


Terdapat perbedaan penamaan style antara safari dan chrome dengan firefox, penulis akan jelaskan nanti.

 

Drop Shadow

Menggunakan drop shadow pada css 3, cukup tambahkan baris

moz ini digunakan untuk browser firefox

dan webkit digunakan untuk browser chrome serta safari

Normalnya ditulis seperti diatas

 

RGBA (Transparency)

rgb 218,227,240 menghasilkan warna abu-abu namun lebih keputih, dan .3 ini menjelaskan penggunaan transparansi 30%.

 

Multiple Border Color

moz-border memungkinkan satu div memiliki banyak border yang berlapis?

 

Select Text Color

-moz-selection terjadi ketika textnya di seleksi? anda bisa lihat hasilnya seperti ini, silahkan textnya anda blok dengan menggunakan mouse.

 

Scale

moz-transform digunakan untuk firefox, dan scale(1.05) menghasilkan perbesaran 1,05 dari ukuran aslinya.

begitu juga dengan webkit-transform yang digunakan untuk browser safari dan chrome.

 

Text Column

menjadikan text memiliki 3 kolom.

dan memiliki garis tengah.

gap disini sama seperti padding, atau jarak antar text.

 

Gradient

penggunaan moz-linear-gradien dengan 45 derajat mulai dari biru tua sampai biru muda, hasilnya adalah seperti ini :

Setelah berkenalan dengan CSS3, [enulis akan jelaskan bagaimana menggunakan CSS lebih lanjut dalam membuat style website maupun layout website, pada Tutorial CSS selanjutnya. Selamat Mencoba.

Sumber:
http://www.css3.info

9 Response untuk Artikel Ini

  1. Jatrasmara

    ckckckckkckc…. gokil abis emang css3 :D


  2. Oentoe

    trims infonya bro.. kayaknya mesti siap-siap nih.


  3. sms cinta romantis

    ty infonya


  4. Rizky

    Muantap tenan :D


  5. faizal

    rajin2 ja untuk berlatih bro.smoga berhasi!!!!!!!!!ok


  6. Negeriads.com solusi berpromosi

    mantap infonya


  7. Andra

    truz biar Css3 bisa support di scriptnya gmn gan????


  8. captbbx

    manteppp… kalau bisa perbanyak lagi ya mas tutorial tentang css nya, sebelumnya thanks banget… :D


  9. Akhyar

    wah…makasih ya info-nya…sangat berguna…


eXTReMe Tracker