Belajar CSS 01: Pendahuluan

Cascading Style Sheets (CSS) merupakan kunci penting dalam membangun tampilan menarik dan teratur untuk halaman web.


Dengan memahami dasar-dasar CSS, Anda dapat memberikan gaya visual yang konsisten dan menarik pada situs web Anda.

Apa itu CSS?

CSS adalah singkatan dari Cascading Style Sheets, yang merupakan bahasa gaya yang digunakan untuk mengontrol tata letak dan penampilan elemen HTML pada halaman web.

Dengan CSS, Anda dapat memisahkan struktur HTML dari presentasi visualnya, memungkinkan Anda membuat perubahan gaya tanpa mengubah struktur dasar konten.


Mengapa CSS Penting?

1.Memisahkan Struktur dan Gaya : 

Dengan menggunakan CSS, Anda dapat memisahkan struktur konten (HTML) dari tampilan dan gaya (CSS), memudahkan pemeliharaan dan pengembangan.

2.Konsistensi :

CSS memungkinkan Anda menerapkan gaya yang konsisten pada seluruh situs web Anda, sehingga menciptakan pengalaman pengguna yang lebih baik.

3.Fleksibilitas :


Anda dapat dengan mudah mengubah tampilan halaman web secara keseluruhan hanya dengan memodifikasi file CSS, tanpa harus menyentuh HTML.

Dasar-Dasar CSS


1.Selector dan Properti

- Selector digunakan untuk menentukan elemen mana yang akan diberi gaya.
- Properti menentukan bagaimana elemen tersebut akan tampil.

Contoh:
css


p { color: blue; font-size: 16px; }


2.Box Model

Setiap elemen HTML dapat dianggap sebagai kotak yang memiliki model box, terdiri dari content, padding, border, dan margin.


css


div { width: 200px; 
        padding: 20px;
        border: 2px solid black;
        margin: 10px; }


3.Class dan ID

Menggunakan class dan ID memungkinkan Anda memberikan gaya pada elemen tertentu tanpa memengaruhi elemen lainnya.

css


.button { background-color: #3498db;
              color: white; }
#header { font-size: 24px; }

Langkah Selanjutnya

dengan memahami dasar-dasar CSS, eksplorasi berbagai properti, dan terapkan pada proyek kecil. Latihan dan eksperimen adalah kunci untuk menguasai CSS. Selamat belajar!

Komentar