Pseudo class adalah kelas khusus yang dapat kita beri style css pada keadaan tertentu.. ada banyak jenis pseudo class / selector, tetapi yang akan dibahas pada video ini hanya yang berhubungan dengan link dan urutan elemen saja..
contoh pseudo-class yang berhubungan dengan link :
:link
:hover
:active
:visited
slide bantuan untuk video youtube:
https://youtu.be/G0gYWdIHOug
Konsep inheritance atau pewarisan ternyata terdapat juga pada CSS, tetapi konsepnya sangat sederhana tidak se-kompleks pada bahasa pemrograman lain seperti Java atau PHP.
Intinya adalah elemen child mewarisi beberapa value dari properti yang dimiliki parentnya.
Nilai dari properti di css yang akan kita pelajari di video ini adalah inherit.
slide bantuan untuk video youtube:
https://youtu.be/kY2FEA3y43E
Masih ingat anatomi dari sebuah sintaks CSS kan? di dalamnya terdapat bagian yang dinamakan selector.
Selector digunakan untuk memilih elemen spesifik pada HTML yang akan diberi style. Ada 3 jenis selector yaitu elemen HTML, id dan class.
slide bantuan untuk video youtube:
https://youtu.be/0KLwWyQyMQo
Setiap selector css yang kita buat memiliki berat yang berbeda, berat tersebut menentukan seberapa spesifik selector yang kita buat. Semakin spesifik, maka style yang dibuat akan semakin berpengaruh.
contohnya jika kita membuat selector dengan elemen HTML maka beratnya adalah 1, jika dengan class maka 10 kali lipat lebih berat dan jika dengan id 100 kali lipat lebih berat.
di video ini akan dijelaskan maksud dari berat masing-masing selector dan bagaimana cara menghitungnya
slide bantuan untuk video youtube:
https://youtu.be/yu74Y1ndd5w
Pada slide kali ini yang akan kita bahas adalah mengenai bagaimana cara memberi style pada background dari sebuah elemen. Setiap elemen bisa kita beri background, namun contoh di slide ini hanya pada body saja.
Selain warna, kita juga dapat menambahkan gambar pada background dan pengatur pengulangan dari gambar serta posisinya. Setelah menyaksikan video ini, silahkan berkreasi dengan background pada halaman web kalian.. :)
slide bantuan untuk video youtube:
https://youtu.be/zm-HPYS_ELU
Setelah di slide sebelumnya kita mempelajari tentang bagaimana memberi style pada font, di slide kali ini yang akan kita bahas adalah memberikan style pada text seperti pengaturan paragraf, pengaturan warna, dll
slide bantuan untuk video youtube:
https://youtu.be/xih8giA7S3Q
Float merupakan properti CSS yang dapat membuat elemen berada di sebelah kiri atau kanan dari pembungkusnya.
Float dapat digunakan untuk beberapa hal berikut :
1. Text Wrapping
2. Image Gallery
3. Multiple Columns
Font merupakan elemen pada halaman web yang berhubungan dengan typeface (jenis tulisan / huruf), bisa mengenai family-nya, ukuran, bold atau tidaknya dan lain-lain.
slide bantuan untuk video youtube:
https://youtu.be/nPHed3_oPvY
Sama seperti HTML, CSS juga memiliki anatomi / struktur dari tiap-tiap deklarasinya. Anatomi tersebut terdiri dari :
1. selector
2. property
3. value
slide bantuan untuk video youtube:
https://youtu.be/8lXDi2Mxp9c
di channel Web Programming UNPAS
Konsep inheritance atau pewarisan ternyata terdapat juga pada CSS, tetapi konsepnya sangat sederhana tidak se-kompleks pada bahasa pemrograman lain seperti Java atau PHP.
Intinya adalah elemen child mewarisi beberapa value dari properti yang dimiliki parentnya.
Nilai dari properti di css yang akan kita pelajari di video ini adalah inherit.
slide bantuan untuk video youtube:
https://youtu.be/kY2FEA3y43E
Masih ingat anatomi dari sebuah sintaks CSS kan? di dalamnya terdapat bagian yang dinamakan selector.
Selector digunakan untuk memilih elemen spesifik pada HTML yang akan diberi style. Ada 3 jenis selector yaitu elemen HTML, id dan class.
slide bantuan untuk video youtube:
https://youtu.be/0KLwWyQyMQo
Setiap selector css yang kita buat memiliki berat yang berbeda, berat tersebut menentukan seberapa spesifik selector yang kita buat. Semakin spesifik, maka style yang dibuat akan semakin berpengaruh.
contohnya jika kita membuat selector dengan elemen HTML maka beratnya adalah 1, jika dengan class maka 10 kali lipat lebih berat dan jika dengan id 100 kali lipat lebih berat.
di video ini akan dijelaskan maksud dari berat masing-masing selector dan bagaimana cara menghitungnya
slide bantuan untuk video youtube:
https://youtu.be/yu74Y1ndd5w
Pada slide kali ini yang akan kita bahas adalah mengenai bagaimana cara memberi style pada background dari sebuah elemen. Setiap elemen bisa kita beri background, namun contoh di slide ini hanya pada body saja.
Selain warna, kita juga dapat menambahkan gambar pada background dan pengatur pengulangan dari gambar serta posisinya. Setelah menyaksikan video ini, silahkan berkreasi dengan background pada halaman web kalian.. :)
slide bantuan untuk video youtube:
https://youtu.be/zm-HPYS_ELU
Setelah di slide sebelumnya kita mempelajari tentang bagaimana memberi style pada font, di slide kali ini yang akan kita bahas adalah memberikan style pada text seperti pengaturan paragraf, pengaturan warna, dll
slide bantuan untuk video youtube:
https://youtu.be/xih8giA7S3Q
Float merupakan properti CSS yang dapat membuat elemen berada di sebelah kiri atau kanan dari pembungkusnya.
Float dapat digunakan untuk beberapa hal berikut :
1. Text Wrapping
2. Image Gallery
3. Multiple Columns
Font merupakan elemen pada halaman web yang berhubungan dengan typeface (jenis tulisan / huruf), bisa mengenai family-nya, ukuran, bold atau tidaknya dan lain-lain.
slide bantuan untuk video youtube:
https://youtu.be/nPHed3_oPvY
Sama seperti HTML, CSS juga memiliki anatomi / struktur dari tiap-tiap deklarasinya. Anatomi tersebut terdiri dari :
1. selector
2. property
3. value
slide bantuan untuk video youtube:
https://youtu.be/8lXDi2Mxp9c
di channel Web Programming UNPAS
Box model adalah konsep yang paling utama dari CSS Layouting, jika kalian paham mengenai ini maka akan mudah untuk kalian dalam melakukan pengaturan tata letak elemen pada website kalian.
ada 4 komponen dalam box model :
1. margin
2. padding
3. border
4. konten
Ada 2 property pada CSS yang digunakan untuk mengatur Dimensi pada elemen HTML kita, property-nya yaitu width dan height.
Pada video ini, kita akan bahas bagaimana cara menggunakan property tersebut, dan juga unit / satuan apa saja yang dapat kita gunakan untuk mengatur width dan height-nya.
Di video ini juga akan dibahas mengenai overflow, yaitu property CSS yang digunakan untuk mengatur perilaku sebuah elemen, ketika isi / konten nya melebihi tempat / parent nya.
slide bantuan untuk video youtube:
https://youtu.be/VkUSH3SIH0g
Position adalah properti CSS yang dapat membuat kita melakukan tata letak dari elemen HTML sesuai dengan keinginan kita.
ada 4 value yang bisa kita gunakan pada properti position :
1. static
2. relative
3. absolute
4. fixed
Ada beberapa cara untuk menampatkan sintaks CSS di halaman web kita. Ada dengan menggunakan cara embed, inline dan external.
slide bantuan untuk video youtube:
https://youtu.be/bnnislprJro
di channel Web Programming UNPAS
Setiap elemen HTML yang kita buat memiliki property css display, pada slide ini akan dibahas bagaimana masing-masing perilaku dari value pada properti display tersebut.
value yang dapat digunakan adalah :
- inline
- inline-block
- block
- none
slide bantuan untuk video youtube:
https://youtu.be/VPaIdiPvWQM
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Sebagai salah satu pertanggungjawab pembangunan manusia di Jawa Timur, dalam bentuk layanan pendidikan yang bermutu dan berkeadilan, Dinas Pendidikan Provinsi Jawa Timur terus berupaya untuk meningkatkan kualitas pendidikan masyarakat. Untuk mempercepat pencapaian sasaran pembangunan pendidikan, Dinas Pendidikan Provinsi Jawa Timur telah melakukan banyak terobosan yang dilaksanakan secara menyeluruh dan berkesinambungan. Salah satunya adalah Penerimaan Peserta Didik Baru (PPDB) jenjang Sekolah Menengah Atas, Sekolah Menengah Kejuruan, dan Sekolah Luar Biasa Provinsi Jawa Timur tahun ajaran 2024/2025 yang dilaksanakan secara objektif, transparan, akuntabel, dan tanpa diskriminasi.
Pelaksanaan PPDB Jawa Timur tahun 2024 berpedoman pada Peraturan Menteri Pendidikan dan Kebudayaan RI Nomor 1 Tahun 2021 tentang Penerimaan Peserta Didik Baru, Keputusan Sekretaris Jenderal Kementerian Pendidikan, Kebudayaan, Riset, dan Teknologi nomor 47/M/2023 tentang Pedoman Pelaksanaan Peraturan Menteri Pendidikan dan Kebudayaan Nomor 1 Tahun 2021 tentang Penerimaan Peserta Didik Baru pada Taman Kanak-Kanak, Sekolah Dasar, Sekolah Menengah Pertama, Sekolah Menengah Atas, dan Sekolah Menengah Kejuruan, dan Peraturan Gubernur Jawa Timur Nomor 15 Tahun 2022 tentang Pedoman Pelaksanaan Penerimaan Peserta Didik Baru pada Sekolah Menengah Atas, Sekolah Menengah Kejuruan dan Sekolah Luar Biasa. Secara umum PPDB dilaksanakan secara online dan beberapa satuan pendidikan secara offline. Hal ini bertujuan untuk mempermudah peserta didik, orang tua, masyarakat untuk mendaftar dan memantau hasil PPDB.
Box model adalah konsep yang paling utama dari CSS Layouting, jika kalian paham mengenai ini maka akan mudah untuk kalian dalam melakukan pengaturan tata letak elemen pada website kalian.
ada 4 komponen dalam box model :
1. margin
2. padding
3. border
4. konten
Ada 2 property pada CSS yang digunakan untuk mengatur Dimensi pada elemen HTML kita, property-nya yaitu width dan height.
Pada video ini, kita akan bahas bagaimana cara menggunakan property tersebut, dan juga unit / satuan apa saja yang dapat kita gunakan untuk mengatur width dan height-nya.
Di video ini juga akan dibahas mengenai overflow, yaitu property CSS yang digunakan untuk mengatur perilaku sebuah elemen, ketika isi / konten nya melebihi tempat / parent nya.
slide bantuan untuk video youtube:
https://youtu.be/VkUSH3SIH0g
Position adalah properti CSS yang dapat membuat kita melakukan tata letak dari elemen HTML sesuai dengan keinginan kita.
ada 4 value yang bisa kita gunakan pada properti position :
1. static
2. relative
3. absolute
4. fixed
Ada beberapa cara untuk menampatkan sintaks CSS di halaman web kita. Ada dengan menggunakan cara embed, inline dan external.
slide bantuan untuk video youtube:
https://youtu.be/bnnislprJro
di channel Web Programming UNPAS
Setiap elemen HTML yang kita buat memiliki property css display, pada slide ini akan dibahas bagaimana masing-masing perilaku dari value pada properti display tersebut.
value yang dapat digunakan adalah :
- inline
- inline-block
- block
- none
slide bantuan untuk video youtube:
https://youtu.be/VPaIdiPvWQM
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Slide pendukung untuk mata kuliah Pemrograman Web 1 di Jurusan Teknik Informatika Universitas Pasundan Bandung.
Digunakan juga sebagai pendukung untuk video di channel youtube "WebProgrammingUNPAS"
https://www.youtube.com/channel/UCkXmLjEr95LVtGuIm3l2dPg
Sebagai salah satu pertanggungjawab pembangunan manusia di Jawa Timur, dalam bentuk layanan pendidikan yang bermutu dan berkeadilan, Dinas Pendidikan Provinsi Jawa Timur terus berupaya untuk meningkatkan kualitas pendidikan masyarakat. Untuk mempercepat pencapaian sasaran pembangunan pendidikan, Dinas Pendidikan Provinsi Jawa Timur telah melakukan banyak terobosan yang dilaksanakan secara menyeluruh dan berkesinambungan. Salah satunya adalah Penerimaan Peserta Didik Baru (PPDB) jenjang Sekolah Menengah Atas, Sekolah Menengah Kejuruan, dan Sekolah Luar Biasa Provinsi Jawa Timur tahun ajaran 2024/2025 yang dilaksanakan secara objektif, transparan, akuntabel, dan tanpa diskriminasi.
Pelaksanaan PPDB Jawa Timur tahun 2024 berpedoman pada Peraturan Menteri Pendidikan dan Kebudayaan RI Nomor 1 Tahun 2021 tentang Penerimaan Peserta Didik Baru, Keputusan Sekretaris Jenderal Kementerian Pendidikan, Kebudayaan, Riset, dan Teknologi nomor 47/M/2023 tentang Pedoman Pelaksanaan Peraturan Menteri Pendidikan dan Kebudayaan Nomor 1 Tahun 2021 tentang Penerimaan Peserta Didik Baru pada Taman Kanak-Kanak, Sekolah Dasar, Sekolah Menengah Pertama, Sekolah Menengah Atas, dan Sekolah Menengah Kejuruan, dan Peraturan Gubernur Jawa Timur Nomor 15 Tahun 2022 tentang Pedoman Pelaksanaan Penerimaan Peserta Didik Baru pada Sekolah Menengah Atas, Sekolah Menengah Kejuruan dan Sekolah Luar Biasa. Secara umum PPDB dilaksanakan secara online dan beberapa satuan pendidikan secara offline. Hal ini bertujuan untuk mempermudah peserta didik, orang tua, masyarakat untuk mendaftar dan memantau hasil PPDB.
3. pseudo-class yang berhubungan dengan link
:link
style default pada sebuah link (a yang memiliki href)
:hover
style ketika kursor mouse berada diatas sebuah link / elemen
:active
style ketika sebuah link di-klik (keadaan aktif)
:visited
style ketika sebuah link sudah pernah dikunjungi sebelumnya
(menggunakan browser yang sama)
4. pseudo-class yang berhubungan dengan posisi elemen (1)
:first-child
memilih elemen pertama dari sebuah parent (elemen pembungkusnya)
:last-child
memilih elemen terakhir dari sebuah parent (elemen pembungkusnya)
:nth-child(n)
memilih elemen ke-n dari sebuah parent (elemen pembungkusnya).
n bisa berarti urutan (1), (2), … atau pola (2n), (3n+2), (4n-1) atau
ganjil dan genap (even) & (odd)
5. pseudo-class yang berhubungan dengan posisi elemen (2)
:first-of-type
memilih elemen pertama dari sebuah jenis / tipe tag
:last-of-type
memilih elemen terakhir dari sebuah jenis / tipe tag