Bidhuan.id – Apa itu CSS? Dalam dunia programmer, istilah CSS memang sudah tidak asing lagi karena setiap programmer yang sudah expert di bidang pengembangan web, pasti kenal yang namanya CSS. Pembahasan saat ini masih berhubungan dengan pembahasan sebelumnya mengenai dunia ilmu komputer migrasi hosting. Namun kali ini penulis ingin membagikan informasi penting seputar CSS, agar anda yang belum paham mengenai ilmu yang satu ini bisa memanfaatkannya di kehidupan sehari – hari.
Memang sering kali terdengar apa itu CSS dari mahasiswa – mahasiswa yang baru menggeluti dunia ilmu komputer. Wajar saja jika mereka masih di semester awal dan baru mempelajari pengenalan – pengenalan istilah asing. Pasti akan tertarik dan bertanya, jika diam saja dan tidak ada ketertarikan malah tidak wajar. Ditakutkan justru tidak serius dalam belajar karena adanya beberapa faktor yang mempengaruhinya.
Nah akan saya jelaskan yang dimaksud dengan CSS, CSS sendiri adalah singkatan dari Cascading Style Sheet. Berikut ini terdapat pengertian lengkap menurut pendapat ahli sobat, agar anda bisa lebih terbiasa memahaminya, membandingkan dan juga mengambil kesimpulan yang dibutuhkan guna menunjang proses pembelajaran lebih lanjut.
Menurut Jayan (2010:2) mengemukakan bahwa “CSS merupakan singkatan dari Cascading Style Sheet. Kegunaannya adalah untuk mengatur tampilan dokumen HTML, contohnya seperti pengaturan jarak antar baris, teks, warna dan format border bahkan penampilan file gambar.”
Komponen – Komponen yang Berhubungan dan Tidak Bisa Lepas Dari CSS
Dalam ilmu komputer khususnya pembuatan software, memang satu komponen yang digunakan untuk merancang dan membangunnya tidak akan bisa berjalan sendiri tanpa adanya komponen lain yang mendukungnya. Untuk itu penulis ingin memberikan informasi tersebut bagi anda agar anda tidak berfokus saja pada CSS, sehingga nantinya anda bisa lebih mempunyai wawasan yang luas.
Komponen tersebut antara lain :
- Database : suatu wadah yang nantinya digunakan untuk menampung berbagai data yang diinput melalui suatu sistem (web atau pun dekstop)
- PHP : kumpulan kode yang merupakan bagian dari CSS namun lebih ringkas dan simple
- MySQL : software yang mampu membantu anda memanajeman basis data
- Connecter : penghubung antara sistem dan database sehingga data yang diinput melalui sistem program bisa tersimpan dengan baik di dalam database.
Nah keempat komponen di atas cukup penting keberadaannya dan saling berkaitan fungsinya antara yang satu dengan yang lainnya. Penjelasan keempatnya merupakan kesimpulan yang penulis ambil sesuai dengan pengetahuan yang penulis ketahui. Karena pengertian yang dijelaskan sesuai pemahaman sendiri pastinya akan lebih mudah tersampaikan dan dipahami oleh orang lain dibandingkan dengan pengertian bakunya.
Belajar dunia ilmu komputer memang lebih baik dipahami dan dikembangkan sendiri. Penulis menjamin jika anda menerapkan cara yang penulis lakukan, pasti akan lebih cepat pandai dan cekatan dalam menyelesaikan pekerjaan – pekerjaan yang berhubungan dengan pengembangan suatu sistem. Setuju ya sobat?
Tujuan Diciptakannya CSS
Awalnya sebelum CSS diciptakan para programmer merasa kesulitan karena antara konten yang satu dengan konten yang lainnya tidak bisa dibedakan jika tidak dicermati dengan baik. Sehingga tidak sedikit kasus mereka merasa kebingungan dan membuat program yang mereka bangun seringkali error. Jika sudah error tentu saja akan membutuhkan waktu untuk mengetahui dimana salah dan penyebabnya ya sobat. Harus teliti melakukan pengecekan satu persatu. Karena saya pun pernah mengalaminya, kurang tanda baca yang sepele seperti titik, koma, kurung dan lain sebagainya saja bisa menyebabkan kesalahan fatal. Inilah seni dan tantangan seorang perancang sistem program.
Sejak adanya CSS, programmer menjadi lebih dimudahkan lagi karena tujuannya sendiri adalah untuk memilah – milah dan membeda – bedakan konten satu dengan lainnya. Pemisahan konten tersebut bisa dengan menggunakan warna, ukuran dan formating yang digunakan. Semuanya sudah dirancang otomatis sehingga sangat memudahkan dan dianggap sebagai angin segar yang membawa solusi tepat guna.
Cara Kerja dari CSS
Jika anda bertanya mengenai cara kerja dari CSS sendiri, pastinya setelah anda mempraktekkannya sendiri dijamin akan langsung paham. Karena pada dasarnya prinsip dan cara kerjanya sangat simple dan juga mudah kok sobat.
Anda hanya perlu menulis atau mengetikkan style yang diinginkan. Style disini meliputi selector dan class yang sudah disesuaikan akan otomatis muncul jika anda menuliskan style dengan baik.
Gunakan kode – kode sesuai desain yang nantinya akan tampil di front endnya. Sehingga desain yang anda inginkan pun bisa berjalan dengan baik. Usahakan untuk menjalankan web yang sedang anda buat, setiap kali menyelesaikan bagian kode – kode tertentu untuk melihat perkembangan front endnya. Browser yang sering digunakan untuk menunjang cara kerjanya ialah Mozilla Firefox karena memang lebih support. Itu hanya saran dari penulis sih sobat, jika anda punya cara yang lebih baik, mudah dan efisien juga bisa diterapkan.
Fungsi dari CSS
Penjelasan mengenai fungsi dari CSS sendiri pasti sudah ditunggu – tunggu oleh sobat semua. Karena memang jika sudah mengetahui pengertiannya pasti fungsi dari sebuah sistem sangat penting untuk dipahami.
CSS dalam dunia pemrogramman digunakan untuk membantu memudahkan untuk memilih dan juga mengatur sebuah website yang sedang dibangun. Mau bagaimana tampilan interface dan front end nya seperti apa sehingga bisa tampilannya tampak lebih menarik dan sangat nyaman digunakan para penggunanya (user friendly).
Dalam kehidupan sehari – hari seorang programmer perlu anda ketahui, CSS punya fungsi lain yang mungkin tidak disadari oleh mereka, seperti halnya mempermudah dan mempercepat pekerjaan yang sedang anda jalani, hemat waktu dan juga biaya.
Nah lo kok bisa dikatakan hemat biaya ya, kalau hemat waktu sudah pasti karena berhubungan dengan kecepatan proses pengerjaan. Saya jelaskan nih sobat jika waktu pengerjaan yang anda lakukan semakin cepat, maka kebutuhan listrik yang anda gunakan pun akan lebih hemat bukan?
Manfaat Penggunaan CSS
Dalam dunia pemrograman penggunaan CSS pada masanya memang sangat memudahkan mereka dalam upaya merancang dan membangun web yang anda inginkan. Tidak sedikit programmer yang menghasilkan banyak uang karena memanfaatkan kecanggihan dari CSS tersebut.
Namun seiring dengan perkembangan teknologi yang semakin cepat, lambat laun pasti terdapat cara mutakhir yang menyempurnakan cara – cara sebelumnya sehingga bisa lebih efisien. Nah transformasi yang ada saat ini adalah munculnya PHP yang bisa menyempurnakan kinerja dari CSS itu sendiri. Yang semula anda harus menuliskan kode – kode tertentu dalam jumlah banyak saat proses pengembangan web, sekarang anda bisa merancang web dengan kode – kode yang lebih singkat.
Meskipun sekarang ini banyak orang mulai beralih menggunakan PHP, keberadaan CSS juga cukup penting ya sobat. Karena memang PHO sendiri istilahnya adalah kakaknya CSS, jadi bisa digunakan untuk pembelajaran saat ini dan di masa yang akan datang.
Baca: Mengatasi VPS Suspen Karena Load Average Melebihi Batas Maksimum
Contoh Kode – Kode CSS Sederhana
KOde CSS sebenarnya sangat mudah jika anda mau mencobanya. Jika hanya dilihat dan tidak dipahami tentu saja akan membuat anda pusing, karena tidak tahu apa fungsi dari kode – kode tersebut. Di bawah ini terdapat contoh CSS sederhana yang perlu anda ketahui untuk menambah wawasan baru sobat, antara lain :
- Index.html
<!DOCTYPE html><html><head><title></title><link rel=“stylesheet” type=“text/css” href=“style.css”></head><body><div class=“wrap”><div class=“header”><h1>Malas Ngoding</h1><p>Tutorial belajar membuat layout website sederhana</p></div><div class=“menu”><ul><li><a href=“#”>Home</a></li><li><a href=“#”>HTML</a></li><li><a href=“#”>CSS</a></li><li><a href=“#”>PHP</a></li><li><a href=“#”>Javascript</a></li></ul></div><div class=“badan”><div class=“sidebar”>sidebar<ul><li><a href=“#”>Tutorial HTML dasar</a></li><li><a href=“#”>Tutorial CSS dasar</a></li><li><a href=“#”>Tutorial PHP dasar</a></li><li><a href=“#”>Tutorial JQuery dasar</a></li></ul></div><div class=“content”>content</div></div><div class=“clear”></div><div class=“footer”>footer</div></div></body></html>
- Style.CSS
wrap{background: blue;width: 900px;margin: 10px auto;}/*bagian header*/.wrap .header{background: green;/*height: 50px;*/padding: 2px 10px;}/*akhir header*//*bagian menu*/.wrap .menu{background: yellow;}.wrap .menu ul{padding: 0;margin: 0;background: yellow;overflow: hidden;}.wrap .menu ul li{float: left;list–style–type: none;padding: 10px;}/*akhir menu*/.clear{clear: both;}.badan{height: 450px;}/*bagian sidebar*/.wrap .badan .sidebar{background: orange;float: left;width: 25%;height: 100%;}/*akhir sidebar*/.wrap .badan .content{background: red;float: left;height: 100%;width: 75%;}.wrap .footer{width: 100%;padding: 10px;}
Kesimpulan yang bisa diambil dari pembahasan kali ini ialah pada dasarnya semua teknologi yang dikembangkan dalam ilmu komputer adalah untuk memudahkan kehidupan umat manusia modern sehingga taraf hidupnya bisa menjadi lebih baik sesuai dengan perkembangan zaman saat ini.
Sampai disini dulu ya sobat semua pembahasan kali ini mengenai apa itu CSS. Setelah menyimak penjelasan yang penulis sajikan di atas semoga bisa membawa banyak manfaat dalam kehidupan sehari – hari anda. Jangan lupa untuk selalu mengikuti hasil karya penulis selanjutnya. Sampai jumpa di pertemuan berikutnya. Salam sukses.
Baca juga ketika i phone hilang di jepang bisa mudah ditemukan lagi
