Pindah ke:

Terjemahan ini belum lengkap. Mohon bantu menerjemahkan artikel ini dari Bahasa Inggris.

CSS digunakan untuk membuat style dan lay out halaman web - misalnya, untuk mengubah font, warna, ukuran dan jarak dari konten Anda,membaginya menjadi beberapa kolom, atau menambahkan animasi dan fitur dekoratif lainnya. Modul ini membantu Anda memulai jalan menuju penguasaan CSS dengan dasar-dasar cara kerjanya,termasuk pemilih dan properti, menulis aturan CSS, menerapkan CSS ke HTML, cara menentukan panjang, warna, dan unit lainnya dalam CSS , kaskade dan warisan, dan debugging CSS.

Prasyaratan Sebelum memulai modul ini, Anda harus memiliki: 1.Keakraban dasar menggunakan komputer, dan menggunakan   Web secara pasif (yaitu hanya melihatnya, mengonsumsi   konten.) 2.Lingkungan kerja dasar yang ditetapkan secara terperinci   dalam Menginstal perangkat lunak dasar, dan pemahaman   tentang cara membuat dan mengelola file, sebagaimana   diperinci dalam Berurusan dengan file. 3.Keakraban dasar dengan HTML, seperti yang dibahas dalam   pengantar modul HTML.

Catatan: Jika Anda bekerja pada komputer / tablet / perangkat lain di mana Anda tidak memiliki kemampuan untuk membuat file Anda sendiri, Anda dapat mencoba (sebagian besar) contoh kode dalam program pengkodean online seperti JSBin atau Thimble.

 

Panduan Modul ini berisi artikel-artikel berikut, yang akan membawa Anda melalui semua teori dasar CSS, dan memberikan banyak kesempatan bagi Anda untuk menguji beberapa keterampilan. Bagaimana CSS bekerja Dalam modul ini kita mulai dengan landasan teoritis,   melihat apa CSS, bagaimana peramban mengubah HTML   menjadi DOM, bagaimana CSS diterapkan   ke bagian-bagian DOM, beberapa contoh sintaksis yang   sangat mendasar , dan kode apa yang digunakan untuk   benar-benar menyertakan CSS kami di halaman web kami. Sintaks CSS Selanjutnya, kita masuk ke sintaks CSS dalam lebih   banyak detail, melihat bagaimana properti dan nilai-   nilai mereka membentuk deklarasi, beberapa deklarasi   membentuk blok deklarasi, dan blok deklarasi dan   selektor menjadi aturan CSS lengkap. Kami melengkapi   artikel dengan melihat fitur sintaks CSS lainnya   seperti komentar dan spasi. Pemilih Para pemilih disebutkan dalam artikel sebelumnya, tetapi   dalam panduan ini kami membahas lebih banyak detail,   menunjukkan jenis selector apa yang tersedia dan   bagaimana mereka bekerja. Nilai dan unit CSS Ada banyak jenis nilai properti CSS yang perlu   dipertimbangkan, mulai dari nilai numerik hingga warna   hingga fungsi yang melakukan tindakan tertentu   (seperti menyematkan gambar latar belakang atau memutar   elemen.) Sebagian bergantung pada unit tertentu untuk   menentukan nilai eksak yang mereka wakili. - apakah Anda ingin kotak Anda menjadi 30 piksel lebar, atau 30 cm, atau 30 ems? Dalam panduan ini, kami melihat nilai yang lebih umum seperti panjang, warna dan fungsi sederhana, serta menjelajahi unit yang kurang umum seperti derajat, dan bahkan nilai numerik tanpa unit. Cascade dan warisan CSS memiliki dua sistem yang berbeda tetapi terkait untuk   menyelesaikan situasi di mana Anda memiliki konflik pemilih (pemilih yang berbeda memilih elemen yang sama;   yang mana yang menang dan akhirnya diterapkan?)   Dan elemen bersarang di dalam elemen lain (beberapa gaya   yang diterapkan pada elemen induk membuat akal untuk   diwarisi oleh elemen anak, beberapa tidak.) Artikel ini   mencakup kedua sistem dalam detail yang cukup untuk   menjadi berguna tetapi tidak berlebihan. Model kotak Model kotak CSS adalah fondasi layout di Web - setiap   elemen direpresentasikan sebagai kotak persegi panjang,   dengan konten kotak, padding, border, dan margin yang   dibangun di sekitar satu sama lain seperti lapisan bawang.   Saat browser menampilkan halaman web, ia akan mengetahui   gaya apa yang diterapkan pada konten setiap kotak,   seberapa besar lapisan bawang di sekitarnya, dan di mana   kotak-kotak itu saling terkait satu sama lain.   Sebelum memahami cara membuat layout CSS, Anda perlu   memahami model kotak. CSS Debugging Dalam artikel terakhir dari modul ini, kita melihat   dasar-dasar debugging CSS, termasuk menjelajahi CSS yang   diterapkan ke halaman, dan alat-alat lain yang dapat   membantu Anda menemukan kesalahan dalam kode CSS Anda.

Assessments

The following assessments will test your understanding of the CSS basics covered in the guides above.

Fundamental CSS comprehension
This assessment tests your understanding of the above guides with some carefully crafted exercises.

See also

Intermediate Web Literacy 1: Intro to CSS
An excellent Mozilla foundation course that explores and tests a lot of the skills talked about in the Introduction to CSS module. Learn about styling HTML elements on a webpage, CSS selectors, attributes, and values.

Tag Dokumen dan Kontributor

Kontributor untuk laman ini: SphinxKnight, BurhanDaepat, chrisdavidmills
Terakhir diperbarui oleh: SphinxKnight,