Mungkin sebagian anda yng suka ngeblog sudah hafal dan paham dengan namanya CSS tetapi bagi yng awam masih bingung apa perbedaan CSS dengan CSS3. sebulum membahas itu kita bahas dulu pengertiang tentang CSS

•  Mempersingkat penulisan tag HTML : Anda tidak perlu lagi mendefinisikan setiap tag dengan property dan nilai yang sama.
•  Mempercepat proses rendering atau pembacaan HTML karena tidak terdapat pengulangan tulisan.
• Mudah dan cepat dalam me-maintenance : dikarenakan file CSS dibuat secar terpisah , maka Anda tidak perlu merombak semua elemen atau property dalam HTML, cukup mengedit file CSS-nya saja.

• border-color
• border-image
• border-radius
• box-shadow

• background-origin dan background-clip
• background-size
• multiple backgrounds

• HSL colors
• HSLA colors
• opacity
• RGBA colors

• text-shadow
• text-overflow
• word-wrap

• box-sizing
• resize
• outline
• nav-top, nav-right, nav-bottom, nav-left

• attribute selectors

• overflow-x, overflow-y

• content

• media queries
• multi-column layout
• Web fonts
• speech

• CSS3 bisa lebih detail untuk mendeklarasikan objek yang akan diberikan style. Contohnya di dalam objek ‘blockquote’ bisa membuat (quote) di awal dan akhirnya menggunakan font lebih besar dari konten blockquote itu sendiri.

• CSS3 kaya akan fitur untuk animasi dan efek untuk text atau objek, yang sebelumnya tidak bisa dilakukan oleh CSS2/CSS2.1, dan bisa menggantikan peran gambar. Standar web 2.0 atau situs interaktif dan efisien berdasar dari penggunaan CSS.

• Dengan CSS3 situs akan bisa lebih berkembang dan bisa lebih interaktif lagi dengan pengunjung.

• Bisa mengurangi ukuran file yang di-load dan lebih ringan, secara otomatis mengurangi bandwidth inbound/outbound situs.
• CSS3 tak berbeda jauh dari tingkat-tingkat sebelumnya, hanya saja memiliki performa style yang jauh lebih baik dan tambahan beberapa fungsi yang menarik.

Cara Membuat Garis Border Melengkung - Pada artikel sebelumnya, saya sudah menjelaskan tentang cara menambahkan garis border dan macam macam garis border untuk gambar di artikel atau di blog. Pada artikel ini, masih dengan topik yang sama akan dilanjutkan lebih spesifik lagi tentang garis border dengan tampilan yang berbeda dari sebelumnya yaitu membuat garis border melengkung. Maksud dari garis border melengkung ini adalah kita akan membuat garis border yang memiliki sudut melengkung dari setiap pojok yang digunakan dalam menampilkan sebuah bingkai gambar seperti yang terlihat pada tampilan gambar berikut ini


Demo dan Kode


Kode: <div style="-moz-border-radius: 20px 10px 20px 10px; -webkit-border-radius: 20px 10px 20px 10px; background-color: #cccccc; border-radius: 20px; border: 2px solid black; color: black; font-family: Arial; padding: 5px;">Tepi Kiri Kanan Melengkung</div>

Kode: <div style="-moz-border-radius: 1em 0em 0em 0em; background-color: orange; border-radius: 1em 0em 0em 0em; border: 2px solid #000; color: white; height: auto; margin: 0 auto; overflow: hidden;">Pojok Kiri Atas Melengkung</div>

Kode: <div style="-moz-border-radius: 0em 0em 0em 1em; background-color: green; border-radius: 0em 0em 0em 1em; border: 2px solid #000; color: white; height: auto; margin: 0 auto; overflow: hidden;">Pojok Kiri Bawah Melengkung</div>

Kode: <div style="-moz-border-radius: 0em 1em 0em 0em; background-color: red; border-radius: 0em 1em 0em 0em; border: 2px solid #000; color: white; height: auto; margin: 0 auto; overflow: hidden;">Pojok Kanan Atas Melengkung</div>

Kode: <div style="-moz-border-radius: 0em 0em 1em 0em; background-color: blue; border-radius: 0em 0em 1em 0em; border: 2px solid #000; color: white; height: auto; margin: 0 auto; overflow: hidden;">Pojok Kanan Bawah Melengkung</div>

Kode: <div style="-moz-border-radius: 1em 0em 0em 1em; background-color: gold; border-radius: 1em 0em 0em 1em; border: 2px solid #000; color: white; height: auto; margin: 0 auto; overflow: hidden;">Tepi Kiri Melengkung</div>

Kode: <div style="-moz-border-radius: 1em 0em 0em 1em; background-color: royalblue; border-radius: 1em 0em 0em 1em; border: 2px solid #000; color: white; height: auto; margin: 0 auto; overflow: hidden;">Tepi Kanan Melengkung</div>

Untuk membuat tampilan seperti diatas. Anda cukup menambahkan kode-kode yang ada diatas untuk setiap jenis garis border melengkung kedalam artikel gambar di area postingan

Itulah cara membuat garis border melengkung. Untuk tampilan yang lebih dan memiliki keunikan tersendiri, silahkan atur kode-kode berikut yang ada didalam kode diatas

-moz-border-radius: 0em 0em 0em 1em;
border-radius: 0em 0em 0em 1em;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
border-radius: 20px;
background-color: #ccc;
border: 2px solid black;
color: #000;
padding: 5px;

Silahkan ganti dan atur setiap skala (nomer ukuran) yang ada diatas dan lihat hasilnya dengan perubahan yang anda lakukan. Maaf saya tidak bisa menjelaskan lebih lanjut untuk mengatur skala ini karena hal ini semata-mata untuk mendorong anda agar lebih kreatif dan imajinatif dalam mengaplikasikan sebuah panduan.

Pada dasarnya dalam mengkofigurasi berbagai jenis akses point itu sama tidak akan jauh berbeda, dari fungsinya juga sama2 untuk menghubungkan komputer yang satu dengan yang lain melewati jaringan nirkabel atau wireless maka yang perlu dipahami bukan sebatas settingan suatu type akses point saja, melainkan prinsip kerja sebuah akses point tersebut.

1. langkah awal yang perlu dilakukan adalah menyamakan IP antara access point dengan sebuah komputer sehingga alamatnya berada pada satu network. Secara default, IP yang tertera pada label access point jenis ini adalah 192.168.1.1, maka anda dapat mengganti IP laptop anda dengan IP 192.168.1.xxx ( tidak boleh angka 1) dan netmask 255.255.255.0.
2. Setelah itu koneksikan access point dengan PC dengan menggunakan kabel straight.
3. Buka web browser misal, kemudian ketikkan alamat IP default dari access point tersebut. Sebelumnya saya telah menjelaskan bahwa IP default access point jenis ini adalah 192.168.1.1, namun pada praktek ini saya menggunakan access point yang IP address-nya telah diubah menjadi 10.10.7.1. Maka ketikkan IP 10.10.7.1 pada address bar, lalu tekan Enter pada keyboard.
4. Setelah itu akan muncul sebuah kotak dialog Authentication Required. Isikan username dengan admin dan isikan password dengan admin. Kemudian klik OK.
   
   

6. Kemudian akan muncul sebuah halaman web seperti berikut :
   
   

7. Klik teks "Network" pada jendela sebelah kiri untuk mengatur tipe jaringan (Static IP / DHCP), main IP dari access point (IP local), dan subnet mask. Jika IP access point diubah dari IP default-nya, maka halaman web akan menghilang. Untuk menampilkannya kembali, ubah IP laptop sehingga menjadi se-network dengan IP access point yang baru. Setelah semua pengaturan selesai, klik Save. Contoh :
   
   

8. Setelah itu lakukan pengaturan wireless dengan meng-klik teks Wireless pada jendela sebelah kiri kemudian pilih Wireless Setting.
9. Pengaturan yang perlu dilakukan adalah pengaturan SSID (nama jaringan), Region, Channel (untuk informasi mengenai channel wireless, klik disini), dan Mode. Yang lainnya adalah pengaturan opsional (tergantung kebutuhan). Dalam hal ini saya membuat nama jaringan (SSID) yaitu tujuh. Setelah semua pengaturan selesai, klik Save. Contoh :
   
   

10. Setelah itu lakukan pengaturan untuk DHCP agar device yang terkoneksi akan mendapatkan IP secara otomatis dari access point. Klik teks DHCP pada jendela sebelah kiri, kemudian pilih DHCP Settings. Dalam hal ini saya melakukan pengaturan range user sebanyak 10 client dari 10.10.7.10 - 10.10.7.20. Setelah semua pengaturan selesai, klik Save. Contoh :
    
    

11. Setelah semua pengaturan selesai diberikan, reboot access point dengan meng-klik teks System Tools kemudian pilih Reboot.
    
    

12. Sistem access point akan restart dalam beberapa saat yang diindikasikan oleh persentasi seperti gambar berikut :
    
    

Setelah proses restarting selesai, maka selanjutnya adalah lakukan pengetesan jaringan access point yang baru dibuat. Gunakan sebuah laptop lain untuk mengakses jaringan wireless dengan nama tujuh. Kemudian lihatlah IP DHCP yang diperoleh laptop tersebut selama terkoneksi dengan jaringan tujuh. Tentunya IP yang didapatkan akan berada pada range 10.10.7.10 sampai 10.10.7.20.

Mungkin sudah banyak yang bisa menebak caranya membuat div rata tengah, yaitu dengan ‘margin: 0 auto’. Namun ternyata itu hanya berhasil untuk rata tengah horizontal, bagaimana dengan rata tengah secara vertical?
Lalu bagaimana agar div rata tengah baik vertical dan horizontal? Ternyata dapat dilakukan dengan hanya menambahkan element : height kedalam CSS.
misalnya CSS awal adalah:
Cukup tambahkan:
Elemen div apakah sudah rata tengah horizontal dan vertical sekarang? yep, dan ini sudah saya tes pada beberapa browser umum seperti chrome, mozilla, safari dan opera. bekerja dengan baik
Sedikit penjelasan yang mungkin menjawab pertanyaan, mengapa bisa rata tengah secara vertical dan horizontal:
1. jika nilai margin-top dan margin-bottom adalah auto, nilai yang pakai adalah ’0′
2. position: absolute; posisi div menjadi tetap, baik jika digunakan bersamaan dengan top, bottom, left, right.
3. top, bottom, left dan right : 0, memerintahkan browser untuk memberikan bounding box / batasan baru setelah di absolute-kan
4. width dan height, browser memberi nilai default 100% jika tidak ada nilai awalnya.
Semoga dapat memberikan pencerahan. Jika ada yang mau menambahkan metode diatas silahkan memberikan masukannya di kolom komentar dibawah ini