Tutorial Belajar CSS Bagian 1 : Apa Itu CSS ?

0
1482

CSS digunakan untuk mengatur tampilan, gaya dari sebuha dokumen web dengan cara yang sederhana dan mudah.

CSS adalah singkatan dari “Cascading Style Sheet”.

Pada tutorial CSS di Mbah WP ini, akan mencakup versi CSS1, CSS2, dan CSS3, dan memberikan pemahaman lengkap tentang CSS, mulai dari dasar-dasarnya hingga konsep lanjutan.

Mengapa Belajar CSS?

Cascading Style Sheets, yang sering disebut sebagai CSS, adalah bahasa desain sederhana yang dimaksudkan untuk menyederhanakan proses pembuatan halaman web yang rapi.

Belajar CSS adalah KEHARUSAN bagi Anda yang ingin bekerja untuk menjadi programmer desain web. Berikut daftar beberapa keuntungan utama dari belajar CSS:

  • Buat Situs Web yang Menakjubkan – CSS menangani tampilan dari halaman web. Dengan menggunakan CSS, Anda dapat mengontrol warna teks, gaya font, jarak antar paragraf, bagaimana ukuran dan tata letak kolom, gambar latar atau warna apa yang digunakan, desain tata letak, variasi tampilan untuk berbagai perangkat dan ukuran layar. serta berbagai macam efek lainnya.
  • Menjadi desainer web – Jika Anda ingin memulai karir sebagai desainer web profesional, mendesain HTML dan CSS adalah keahlian yang harus dimiliki.
  • Kontrol web – CSS mudah dipelajari dan dipahami tetapi memberikan kontrol yang kuat atas presentasi dokumen HTML. Paling umum, CSS digabungkan dengan bahasa markup HTML atau XHTML.
  • Belajar bahasa lain – Setelah Anda memahami dasar-dasar HTML dan CSS, teknologi terkait lainnya seperti javascript, php, atau angular menjadi lebih mudah untuk dipahami.

Halo Dunia menggunakan CSS

Sekadar perkenalan dengan CSS, kita akan melihat program kecil Halo Dunia menggunakan CSS secara konvensional :

<!DOCTYPE html>
<html>
   <head>
      <title>Ini adalah judul dokumen</title>
      <style>
           h1 {
           color: #36CFFF; 
           }
      </style>
   </head>	
   <body>
      <h1>Halo Dunia!</h1>
   </body>	
</html>

Aplikasi CSS

Seperti yang disebutkan sebelumnya, CSS adalah salah satu bahasa desain yang paling banyak digunakan di web, kenapa CSS banyak digunakan :

CSS menghemat waktu – Anda dapat menulis kode CSS satu kali dan kemudian menggunakan kode yang sama untuk beberapa halaman HTML. Anda dapat menentukan gaya untuk setiap elemen HTML dan menerapkannya ke halaman Web sebanyak yang Anda inginkan.

Halaman dapat dimuat lebih cepat – Jika Anda menggunakan CSS, Anda tidak perlu menulis atribut tag HTML berulang kali. Cukup tulis satu kode aturan CSS dari sebuah tag dan terapkan ke semua tag tyang dituju. Artinya, semakin sedikit kode yang ditulis, waktu memuat script semakin cepat.

Perawatan mudah – Untuk membuat perubahan secara global, cukup ubah stylenya, dan semua elemen di semua halaman web akan diperbarui secara otomatis.

Fitur style yang lebih banyak untuk HTML – CSS memiliki atribut yang jauh lebih banyak daripada HTML, sehingga Anda dapat memberikan tampilan yang jauh lebih baik ke halaman HTML Anda dibandingkan dengan menggunakan atribut HTML.

Kompatibilitas Beberapa Perangkat – CSS didukung oleh banyak perangkat dan banyak browser. Dengan menggunakan dokumen HTML yang sama, versi berbeda dari situs web dapat disajikan untuk perangkat genggam seperti tablet dan handphone atau untuk pencetakan.

Standar web global – Untuk desain web, atribut HTML tidak digunakan lagi dan disarankan untuk menggunakan CSS. Jadi ide yang baik untuk mulai menggunakan CSS di semua halaman HTML agar kompatibel dengan browser masa depan.

Syarat Belajar & Menggunakan CSS

Anda harus terbiasa dengan:

  • Dapat menggunakan Editor We Programing seperti notepad ++, Visual Studio Code, dll.
  • Mengerti cara membuat direktori dan file.
  • Mengerti bagaimana menavigasi melalui direktori yang berbeda.
  • Mengerti menggunakan browser Internet.
  • Mengerti menggunakan HTML.

Jika Anda baru mengenal HTML, disarankan Anda untuk membaca Tutorial HTML terlebih dahulu.

TINGGALKAN KOMENTAR

Silakan masukkan komentar anda!
Silakan masukkan nama Anda di sini

Situs ini menggunakan Akismet untuk mengurangi spam. Pelajari bagaimana data komentar Anda diproses.