Dokumen ini membahas pentingnya CSS dalam pengembangan web untuk menciptakan tampilan yang menarik dan responsif, serta menjelaskan konektivitas database untuk manajemen data aplikasi web. CSS digunakan untuk menentukan gaya visual halaman, seperti tata letak, warna, dan font, sedangkan konektivitas database, biasanya melalui PHP, Python, atau JavaScript, memungkinkan pengolahan data secara dinamis. Dengan integrasi CSS dan database, pengembang dapat menciptakan aplikasi web yang estetis dan interaktif.

1. TUGAS PRESENTASI
materi css dasar dan
konektivitas database

2. ANGGOTA
Toni Wibowo

3. LATAR BELAKANG
Dalam pengembangan web modern, tampilan yang menarik
dan fungsi dinamis sangat penting. CSS digunakan untuk
mengatur desain dan tata letak halaman web, memastikan
tampilan responsif dan user-friendly di berbagai perangkat. Di
sisi lain, konektivitas database memungkinkan aplikasi web
mengelola dan menyimpan data secara efisien. Dengan
integrasi yang tepat antara CSS dan konektivitas database,
pengembang dapat menciptakan aplikasi web yang estetis,
interaktif, dan mampu menangani data pengguna secara
optimal

4. MATERI 1
CSS merupakan singkatan dari Cascading Style Sheets, CSS digunakan untuk
menentukan gaya dari tampilan website yang akan kamu buat seperti tata
letak halaman, warna , dan font. Semuanya dapat ditentukan oleh CSS, CSS
bertujuan agar website terlihat lebih menarik.
Pada dasarnya tanpa menggunakan CSS, tampilan website dapat terlihat
menarik hanya dengan bahasa HTML namun penggunaan HTML terbukti
tidak efektif jika digunakan untuk design tampilan oleh karena itu CSS dan
HTML tidak dapat dipisahkan satu sama lain
PENGERTIAN CSS

5. 1.Selektor CSS
Pengertian Selektor CSS
Selektor digunakan untuk menentukan elemen mana yang akan diberi gaya.
Selektor CSS dibagi menjadi : 3
• Selektor Tag
fungsinya untuk Memilih elemen berdasarkan nama tag HTML.
• Selektor ID
Fungsinya untuk Memilih elemen berdasarkan atribut ID
• Selektor Class
Fungsinya untuk Memilih elemen berdasarkan atribut Class
MATERI 1
MACAM-MACAM CSS

6. 2. Properti CSS
Pengertian Properti CSS
adalah atribut yang digunakan untuk menentukan gaya atau tampilan elemen HTML.
Setiap properti di CSS berfungsi untuk mengubah karakteristik visual dari elemen yang
dipilih, seperti warna, ukuran, margin, padding, tata letak, dan lain-lain.
Properti CSS dibagi menjadi : 3
• Warna
Fungsinya untuk Mengatur warna teks dan latar belakang
• Margin & Padding
Fungsinya untuk Mengatur jarak luar (margin) dan jarak dalam (padding) elemen
• Font
Fungsinya untuk Mengatur jenis, ukuran, dan gaya font
MATERI 1
MACAM-MACAM CSS

7. 3. Layout CSS
Pengertian Layout CSS
adalahcara kita mengatur posisi dan tata letak elemen-elemen di halaman web. Dengan
menggunakan berbagai teknik layout, kita bisa menentukan bagaimana elemen tampil di
layar, baik di perangkat desktop maupun mobile, serta memastikan tampilan yang rapi dan
responsif.
Layout CSS dibagi menjadi : 2
• Display
Fungsinya untuk Menentukan cara elemen ditampilkan (block, inline, inline-block).
• Flexbox
Fungsinya untuk Untuk tata letak responsif dan dinamis
MATERI 1
MACAM-MACAM CSS

8. MATERI 2
Untuk menghubungkan aplikasi web dengan
database, umumnya digunakan bahasa
pemrograman seperti PHP, Python, atau JavaScript
(Node.js).
KONEKTIVITAS DATABASE

9. MATERI 2
Contoh berikut menggunakan PHP dan MySQL
sebagai contoh umum.
1.Koneksi PHP dengan MySql
• Pertama, pastikan MySQL sudah aktif dan
memiliki database yang akan dihubungkan.
• Gunakan kode PHP untuk melakukan koneksi.
KONEKTIVITAS DATABASE

10. MATERI 2
Contoh berikut menggunakan PHP dan MySQL
sebagai contoh umum.
2.Menjalankan Query SQL
• Setelah koneksi berhasil, kita dapat
menjalankan perintah SQL seperti SELECT,
INSERT, UPDATE, dan DELETE.
KONEKTIVITAS DATABASE

11. MATERI 2
Contoh berikut menggunakan PHP dan MySQL
sebagai contoh umum.
3.Menutup Koneksi
• Setelah operasi selesai, koneksi ke database
harus ditutup untuk menghindari kebocoran
memori.
KONEKTIVITAS DATABASE

12. KESIMPULAN
• CSS membantu mengatur tampilan dan tata letak
halaman web.
• Konektivitas database diperlukan untuk
mengambil dan mengolah data secara dinamis di
web.

13. TERIMA KASIH