SlideShare a Scribd company logo
1 of 7
Download to read offline
Di susun Oleh: kelompok pemograman web 1 dengan anggota:
1. Elpin dri
2. M.nainuridho
3. M.prianda utama
4. Muhammad rafly
5. M.dedek apandi
Dosen pembimbing: M.soekarno putra,S.kom
Codding pada css nya:
Coding pada html nya:
Sehingga tampilan pada web browsernya:
Maka dari coding dan desain di atas pertanyaannya:
1. Apakah manfaat menggunakan css untuk mendesain halaman web ?
2. Apakah fungsi dari css eksternal dan inline yang ada di code di atas ?
3. Apakah keuntungan Anda menggunakan css eksternal pada latihan ini ?
4. Apakah bisa jika ditambahkan css internal ??? Berikan contoh!
Jawab:
1. Manfaatnya menggunakan css untuk mendesain halaman web agar mempermudah
dan mempercepat pembuatan desain web dan dengan css lebih praktis dalam
membuat coding –coding desain web tersebut.
2. Css eksternal fungsinya untuk memudahkan saat Didalam HTML kita perlu
memanggil file CSS dengan menggunakan tag <link> yang diletakkan diantara
tag <head>.
Untuk memanggil CSS dalam tag HTML kita perlu menggunakan atribut class untuk
memanggil CSS selector, dan jika ingin mengganti font untuk semua halaman cukup
mengubah selector CSSnya saja.
Inline merubah satu atau dua element yang hanya ada dalam satu halaman tersebut.
3. Keuntungannya : memudahkan saat Didalam HTML kita hanya perlu memanggil file
CSS dengan menggunakan tag <link> yang diletakkan diantara tag <head>.
4. Bisa di tambahkan css internal tapi lebih baik tidak usah karena Internal CSS digunakan
hanya dalam kondisi tertentu saja apabila ingin merubah sebuah element yang hanya ada pada
satu halaman HTML atau bisa juga dipakai untuk sebuah halaman statis(tidak berubah-ubah).
contohnya:
Sehingga tampilannya berubah pada hurufnya:
Manfaat-CSS-untuk-Mengdesain-Halaman-Web

More Related Content

Similar to Manfaat-CSS-untuk-Mengdesain-Halaman-Web

[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda
[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda
[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog AndaYosua Herbi
 
Study Jam 1 - HTML CSS.pdf
Study Jam 1 - HTML CSS.pdfStudy Jam 1 - HTML CSS.pdf
Study Jam 1 - HTML CSS.pdfanjarmath
 
Makalah kata kunci
Makalah kata kunciMakalah kata kunci
Makalah kata kuncimiftaaulia5
 
Aplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffolding
Aplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffoldingAplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffolding
Aplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffoldingBudi Permana
 
Laporan Praktikum Basis Data Modul VI-Membuat Website
Laporan Praktikum Basis Data Modul VI-Membuat WebsiteLaporan Praktikum Basis Data Modul VI-Membuat Website
Laporan Praktikum Basis Data Modul VI-Membuat WebsiteShofura Kamal
 
Pemrograman Berbasis Web - CSS
Pemrograman Berbasis Web - CSSPemrograman Berbasis Web - CSS
Pemrograman Berbasis Web - CSSAhmad Afandi
 
1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx
1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx
1_Pengantar_Web_Desain_aaaaaaaaapptx.pptxDeniHidayat46
 
AI Talks #3: Bagaimana AI?
AI Talks #3: Bagaimana AI?AI Talks #3: Bagaimana AI?
AI Talks #3: Bagaimana AI?SABDA
 
SEO (Search Engine Optimizing)
SEO (Search Engine Optimizing)SEO (Search Engine Optimizing)
SEO (Search Engine Optimizing)Aditya Fakhri
 

Similar to Manfaat-CSS-untuk-Mengdesain-Halaman-Web (20)

Laporan css
Laporan cssLaporan css
Laporan css
 
[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda
[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda
[Panduan Lengkap] Cara Menentukan Kata Kunci paling Tepat bagi Blog Anda
 
Laporan css
Laporan cssLaporan css
Laporan css
 
Study Jam 1 - HTML CSS.pdf
Study Jam 1 - HTML CSS.pdfStudy Jam 1 - HTML CSS.pdf
Study Jam 1 - HTML CSS.pdf
 
Makalah kata kunci
Makalah kata kunciMakalah kata kunci
Makalah kata kunci
 
Tugas4
Tugas4Tugas4
Tugas4
 
Laporan css (1152)
Laporan css (1152)Laporan css (1152)
Laporan css (1152)
 
BOOK-web-programming.pdf
BOOK-web-programming.pdfBOOK-web-programming.pdf
BOOK-web-programming.pdf
 
seo
seoseo
seo
 
Web
WebWeb
Web
 
Pengenalan Dasar Dasar web dengan CSS.docx
Pengenalan Dasar Dasar web dengan CSS.docxPengenalan Dasar Dasar web dengan CSS.docx
Pengenalan Dasar Dasar web dengan CSS.docx
 
Modul Pembelajaran dasar dasar PPLG Pemrograman web
Modul Pembelajaran dasar dasar PPLG Pemrograman webModul Pembelajaran dasar dasar PPLG Pemrograman web
Modul Pembelajaran dasar dasar PPLG Pemrograman web
 
Aplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffolding
Aplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffoldingAplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffolding
Aplikasi crud-menggunakan-framework-codeigniter-dengan-teknik-scaffolding
 
Laporan Praktikum Basis Data Modul VI-Membuat Website
Laporan Praktikum Basis Data Modul VI-Membuat WebsiteLaporan Praktikum Basis Data Modul VI-Membuat Website
Laporan Praktikum Basis Data Modul VI-Membuat Website
 
Web templating
Web templatingWeb templating
Web templating
 
Web templating
Web templatingWeb templating
Web templating
 
Pemrograman Berbasis Web - CSS
Pemrograman Berbasis Web - CSSPemrograman Berbasis Web - CSS
Pemrograman Berbasis Web - CSS
 
1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx
1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx
1_Pengantar_Web_Desain_aaaaaaaaapptx.pptx
 
AI Talks #3: Bagaimana AI?
AI Talks #3: Bagaimana AI?AI Talks #3: Bagaimana AI?
AI Talks #3: Bagaimana AI?
 
SEO (Search Engine Optimizing)
SEO (Search Engine Optimizing)SEO (Search Engine Optimizing)
SEO (Search Engine Optimizing)
 

Recently uploaded

PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptxPPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptxssuser8905b3
 
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdfMODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdfNurulHikmah50658
 
AKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMM
AKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMMAKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMM
AKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMMIGustiBagusGending
 
Contoh Laporan Observasi Pembelajaran Rekan Sejawat.pdf
Contoh Laporan Observasi Pembelajaran Rekan Sejawat.pdfContoh Laporan Observasi Pembelajaran Rekan Sejawat.pdf
Contoh Laporan Observasi Pembelajaran Rekan Sejawat.pdfCandraMegawati
 
Integrasi nasional dalam bingkai bhinneka tunggal ika
Integrasi nasional dalam bingkai bhinneka tunggal ikaIntegrasi nasional dalam bingkai bhinneka tunggal ika
Integrasi nasional dalam bingkai bhinneka tunggal ikaAtiAnggiSupriyati
 
PPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptx
PPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptxPPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptx
PPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptxdpp11tya
 
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..ikayogakinasih12
 
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..ikayogakinasih12
 
Refleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptx
Refleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptxRefleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptx
Refleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptxIrfanAudah1
 
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...Kanaidi ken
 
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdfREFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdfirwanabidin08
 
Kontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptx
Kontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptxKontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptx
Kontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptxssuser50800a
 
Diskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdf
Diskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdfDiskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdf
Diskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdfHendroGunawan8
 
Paparan Refleksi Lokakarya program sekolah penggerak.pptx
Paparan Refleksi Lokakarya program sekolah penggerak.pptxPaparan Refleksi Lokakarya program sekolah penggerak.pptx
Paparan Refleksi Lokakarya program sekolah penggerak.pptxIgitNuryana13
 
Dasar-Dasar Sakramen dalam gereja katolik
Dasar-Dasar Sakramen dalam gereja katolikDasar-Dasar Sakramen dalam gereja katolik
Dasar-Dasar Sakramen dalam gereja katolikThomasAntonWibowo
 
Modul Projek - Batik Ecoprint - Fase B.pdf
Modul Projek  - Batik Ecoprint - Fase B.pdfModul Projek  - Batik Ecoprint - Fase B.pdf
Modul Projek - Batik Ecoprint - Fase B.pdfanitanurhidayah51
 
contoh penulisan nomor skl pada surat kelulusan .pptx
contoh penulisan nomor skl pada surat kelulusan  .pptxcontoh penulisan nomor skl pada surat kelulusan  .pptx
contoh penulisan nomor skl pada surat kelulusan .pptxHR MUSLIM
 
PERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptx
PERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptxPERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptx
PERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptxRizkyPratiwi19
 
aksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdf
aksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdfaksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdf
aksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdfwalidumar
 
Hiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaa
HiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaaHiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaa
Hiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaafarmasipejatentimur
 

Recently uploaded (20)

PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptxPPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
PPT AKUNTANSI KEUANGAN MENENGAH DUA.pptx
 
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdfMODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
MODUL 1 Pembelajaran Kelas Rangkap-compressed.pdf
 
AKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMM
AKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMMAKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMM
AKSI NYATA BERBAGI PRAKTIK BAIK MELALUI PMM
 
Contoh Laporan Observasi Pembelajaran Rekan Sejawat.pdf
Contoh Laporan Observasi Pembelajaran Rekan Sejawat.pdfContoh Laporan Observasi Pembelajaran Rekan Sejawat.pdf
Contoh Laporan Observasi Pembelajaran Rekan Sejawat.pdf
 
Integrasi nasional dalam bingkai bhinneka tunggal ika
Integrasi nasional dalam bingkai bhinneka tunggal ikaIntegrasi nasional dalam bingkai bhinneka tunggal ika
Integrasi nasional dalam bingkai bhinneka tunggal ika
 
PPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptx
PPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptxPPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptx
PPT PERUBAHAN LINGKUNGAN MATA PELAJARAN BIOLOGI KELAS X.pptx
 
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
 
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
AKSI NYATA NARKOBA ATAU OBAT TERLARANG..
 
Refleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptx
Refleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptxRefleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptx
Refleksi Mandiri Modul 1.3 - KANVAS BAGJA.pptx.pptx
 
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
RENCANA + Link2 Materi Pelatihan/BimTek "PTK 007 Rev-5 Thn 2023 (PENGADAAN) &...
 
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdfREFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
REFLEKSI MANDIRI_Prakarsa Perubahan BAGJA Modul 1.3.pdf
 
Kontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptx
Kontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptxKontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptx
Kontribusi Islam Dalam Pengembangan Peradaban Dunia - KELOMPOK 1.pptx
 
Diskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdf
Diskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdfDiskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdf
Diskusi PPT Sistem Pakar Sesi Ke-4 Simple Naïve Bayesian Classifier .pdf
 
Paparan Refleksi Lokakarya program sekolah penggerak.pptx
Paparan Refleksi Lokakarya program sekolah penggerak.pptxPaparan Refleksi Lokakarya program sekolah penggerak.pptx
Paparan Refleksi Lokakarya program sekolah penggerak.pptx
 
Dasar-Dasar Sakramen dalam gereja katolik
Dasar-Dasar Sakramen dalam gereja katolikDasar-Dasar Sakramen dalam gereja katolik
Dasar-Dasar Sakramen dalam gereja katolik
 
Modul Projek - Batik Ecoprint - Fase B.pdf
Modul Projek  - Batik Ecoprint - Fase B.pdfModul Projek  - Batik Ecoprint - Fase B.pdf
Modul Projek - Batik Ecoprint - Fase B.pdf
 
contoh penulisan nomor skl pada surat kelulusan .pptx
contoh penulisan nomor skl pada surat kelulusan  .pptxcontoh penulisan nomor skl pada surat kelulusan  .pptx
contoh penulisan nomor skl pada surat kelulusan .pptx
 
PERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptx
PERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptxPERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptx
PERAN PERAWAT DALAM PEMERIKSAAN PENUNJANG.pptx
 
aksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdf
aksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdfaksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdf
aksi nyata - aksi nyata refleksi diri dalam menyikapi murid.pdf
 
Hiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaa
HiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaaHiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaa
Hiperlipidemiaaaaaaaaaaaaaaaaaaaaaaaaaaa
 

Manfaat-CSS-untuk-Mengdesain-Halaman-Web

  • 1. Di susun Oleh: kelompok pemograman web 1 dengan anggota: 1. Elpin dri 2. M.nainuridho 3. M.prianda utama 4. Muhammad rafly 5. M.dedek apandi Dosen pembimbing: M.soekarno putra,S.kom
  • 4.
  • 5. Sehingga tampilan pada web browsernya: Maka dari coding dan desain di atas pertanyaannya: 1. Apakah manfaat menggunakan css untuk mendesain halaman web ? 2. Apakah fungsi dari css eksternal dan inline yang ada di code di atas ? 3. Apakah keuntungan Anda menggunakan css eksternal pada latihan ini ? 4. Apakah bisa jika ditambahkan css internal ??? Berikan contoh!
  • 6. Jawab: 1. Manfaatnya menggunakan css untuk mendesain halaman web agar mempermudah dan mempercepat pembuatan desain web dan dengan css lebih praktis dalam membuat coding –coding desain web tersebut. 2. Css eksternal fungsinya untuk memudahkan saat Didalam HTML kita perlu memanggil file CSS dengan menggunakan tag <link> yang diletakkan diantara tag <head>. Untuk memanggil CSS dalam tag HTML kita perlu menggunakan atribut class untuk memanggil CSS selector, dan jika ingin mengganti font untuk semua halaman cukup mengubah selector CSSnya saja. Inline merubah satu atau dua element yang hanya ada dalam satu halaman tersebut. 3. Keuntungannya : memudahkan saat Didalam HTML kita hanya perlu memanggil file CSS dengan menggunakan tag <link> yang diletakkan diantara tag <head>. 4. Bisa di tambahkan css internal tapi lebih baik tidak usah karena Internal CSS digunakan hanya dalam kondisi tertentu saja apabila ingin merubah sebuah element yang hanya ada pada satu halaman HTML atau bisa juga dipakai untuk sebuah halaman statis(tidak berubah-ubah). contohnya: Sehingga tampilannya berubah pada hurufnya: