belajar css

Belajar CSS : Panduan Tutorial Lengkap Dari Dasar

Belajar CSS

Untuk bisa membangun sebuah website yang menarik minimal diperlukan untuk mempelajari dua bahasa, yang pertama bahasa markup html untuk membuat kerangka dasar nya dan belajar CSS untuk memperindah tampilan atau User Interface sebuah website.

Disini kita akan belajar CSS dari dasar langkah demi langkah,  tutorial ini dibuat berseri agar mudah di  pahami oleh pemula.

Apa Itu CSS

CSS kependekan dari Cascading Style Sheet.

CSS digunakan untuk memberikan style atau gaya tampilan sebuah website yang dibuat oleh bahasa markup html, seperti memberikan style kepada text, gambar, list, membuat animasi hingga ke membuat sebuah layout.

Oleh karena itu alangkah baiknya sebelum kamu mulai belajar CSS terlebih dahulu untuk Belajar HTML

Saat Tutorial ini di tulis, CSS sudah mencapai versi 3.

Salah satu fitur terbaru di versi CSS 3 yaitu penambahan fitur untuk pembuatan animasi.

Sebelum CSS mendukung pembuatan animasi, kebanyakan website menggunakan Flash untuk membuat animasi pada website.

Persiapan Belajar CSS

html css

Untuk bisa memulai belajar css dibutuhkan persiapan beberapa tools atau software berikut ini :

Code / Text Editor

Software pertama yang di perlukan untuk membantu proses belajar, diantaranya yaitu software code / text editor.

Ada banyak pilihan aplikasi code / text editor dari yang berbayar hingga yang gratis dengan berbagai fitur nya masing-masing, beberapa code editor yang cukup terkenal dan banyak di gunakan developer diantaranya :

  • Notepad plus plus
  • Atom

 

Atom merupakan pendatang baru jika di bandingkan dengan notepad plus plus, tetapi karena fitur nya dan tampilan nya yang asik buat di pake ngoding text editor ini berkembang dengan cepat baik dari sisi develompent dan komunitas pengguna nya.

Untuk tutorial ini disini kita akan menggunakan Software Code Editor Notepad plus plus.

Notepad plus plus software yang ringan tidak butuh resource computer yang besar, dan fitur yang dimilikinya pun membantu dalam proses belajar agar lebih mudah mempelajari code code dari css dan html, seperti :

  • Syntax Highlighting : fitur ini mewarnai code atau syntax sesuai tipenya, ini akan membantu kita dalam proses memahami sebuah coding atau syntax.
  • Autocomplete : fitur ini memberikan saran sebuah coding yang lengkap saat kita menulis beberapa kata dari awal coding, tentu saja ini membantu kita agar lebih cepat dalam menulis sebuah coding dan juga menjadi hafal coding tersebut.

 

Masih banyak fitur lainnya dari aplikasi notepad plus plus.

Notepad plus plus dapat di download dari situs resminya Notepad Plus Plus

Untuk cara menginstal nya cukup mudah hanya cukup klik next dan finish di akhir.

Browser

Setelah notepad plus plus software selanjutnya yang dibutuhkan adalah software web browser untuk merender atau melihat hasil dari coding html dan css yang sudah dibuat.

Saat ini ada beberapa browser yang banyak digunakan :

  • Google Chorme
  • Mozilla Firefox
  • Opera

 

Silahkan gunakan web browser favorit kamu dan pastikan menggunakan versi yang terbaru karena web browser versi lama tidak mendukung standar terbaru dari bahasa CSS.

Saya rasa untuk langkah awal mengenal dan persiapan belajar css ini sudah cukup.

Di tutorial selanjutnya kita akan mulai masuk ke pengenalan coding dari css.

Belajar Coding Dasar CSS

Di Seri Turorial Ini Kita Akan Mempelajari Coding Dasar dari CSS, yaitu pengenalan selector pada css.

Cara Menggunakan CSS Di HTML

Setelah mempelajari coding dasar CSS dan memahami selector pada css, Langkah Selanjutnya kita akan belajar bagaimana cara menyisipkan atau menggunakan css untuk memberikan style pada html.

Leave a Reply

Your email address will not be published. Required fields are marked *