SlideShare a Scribd company logo
1 of 12
(CSS)
Cascading Style Sheet
Coba Lihat
Coba Lihat
Coba Lihat
Coba Lihat
Table of contents
01 02
03 04
Pengertian Dan
Fungsi CSS
Jenis- Jenis CSS
Cara Kerja CSS
Contoh
Properti CSS
Kepanjangan CSS adalah singkatan dari
Cascading Style Sheets, yang berguna
untuk menyederhanakan proses
pembuatan website dengan mengatur
elemen di bahasa markup. Pemakaian
CSS adalah untuk mendesain website
front end.
01
You can enter a subtitle here if you need it
Fungsi
● Halaman lebih cepat dimuat
● Mempercepat proses desain
● Mengatur style dalam website
Eksternal Internal Inline
Penulisan CSS
CSS
External CSS adalah kode
CSS yang dituliskan
terpisah dengan file
HTML, dan ditulis sendiri
pada file ekstensi .css
Internal CSS adalah kode
CSS yang penulisannya
dalam tag <style> dan
posisinya ada pada
bagian atas header file
HTML.
Jenis yang terakhir ini
langsung memasukkan
kode CSS yang ditulis
pada setiap atribut HTML.
Cara kerja CSS sebenarnya cukup simpel. Mengingat default CSS
memakai Bahasa Inggris berbasis syntax dengan struktur yang
terbilang sederhana, yakni selector dan declaration block.
Cara Kerja CSS
Contoh
<p>This is a paragraph.</p>.
<style>
p {
color: green;
text-weight: bold;
}
<style>
<style>
body
{
background-color: pink;
}
h1
{
font-family: verdana;
font-size: 20px;
}
</style>
Terimakasih
A
?
B
…
2
“

More Related Content

Similar to UKIN Metode Penulisan CSS.pptx

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
 
Praktikum Dasar-Dasar CSS.pdf
Praktikum Dasar-Dasar CSS.pdfPraktikum Dasar-Dasar CSS.pdf
Praktikum Dasar-Dasar CSS.pdfSayedAchmady1
 
Belajar CSS (cascading style sheet)
Belajar CSS (cascading style sheet)Belajar CSS (cascading style sheet)
Belajar CSS (cascading style sheet)Bambang Herlandi
 
File Structure, HTML & Supporting Languages.pptx
File Structure, HTML & Supporting Languages.pptxFile Structure, HTML & Supporting Languages.pptx
File Structure, HTML & Supporting Languages.pptxBeeOkee
 
Ardian css-01-pengenalan-css-september-2015
Ardian css-01-pengenalan-css-september-2015Ardian css-01-pengenalan-css-september-2015
Ardian css-01-pengenalan-css-september-2015Ardian DP
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptFirmanADaru
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptSayedAchmady1
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptHeru762601
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptLukman Fakih
 

Similar to UKIN Metode Penulisan CSS.pptx (20)

Css pweb
Css pwebCss pweb
Css pweb
 
Laporan pbw css
Laporan pbw cssLaporan pbw css
Laporan pbw css
 
chap CSS.pptx
chap CSS.pptxchap CSS.pptx
chap CSS.pptx
 
1210651097 css
1210651097 css1210651097 css
1210651097 css
 
Pertemuan 3 - Pengenalan dasar CSS
Pertemuan 3 - Pengenalan dasar CSSPertemuan 3 - Pengenalan dasar CSS
Pertemuan 3 - Pengenalan dasar CSS
 
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
 
18040 pertemuan13(css)
18040 pertemuan13(css)18040 pertemuan13(css)
18040 pertemuan13(css)
 
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
 
Praktikum Dasar-Dasar CSS.pdf
Praktikum Dasar-Dasar CSS.pdfPraktikum Dasar-Dasar CSS.pdf
Praktikum Dasar-Dasar CSS.pdf
 
Belajar CSS (cascading style sheet)
Belajar CSS (cascading style sheet)Belajar CSS (cascading style sheet)
Belajar CSS (cascading style sheet)
 
File Structure, HTML & Supporting Languages.pptx
File Structure, HTML & Supporting Languages.pptxFile Structure, HTML & Supporting Languages.pptx
File Structure, HTML & Supporting Languages.pptx
 
Ardian css-01-pengenalan-css-september-2015
Ardian css-01-pengenalan-css-september-2015Ardian css-01-pengenalan-css-september-2015
Ardian css-01-pengenalan-css-september-2015
 
Materi CSS.ppt
Materi CSS.pptMateri CSS.ppt
Materi CSS.ppt
 
Materi CSS Dasar
Materi CSS DasarMateri CSS Dasar
Materi CSS Dasar
 
Pertemuan 5
Pertemuan 5Pertemuan 5
Pertemuan 5
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
 
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.pptCSS_(Cascading_Style_Sheet)_lanjutan.ppt
CSS_(Cascading_Style_Sheet)_lanjutan.ppt
 

UKIN Metode Penulisan CSS.pptx

  • 6. Table of contents 01 02 03 04 Pengertian Dan Fungsi CSS Jenis- Jenis CSS Cara Kerja CSS Contoh Properti CSS
  • 7. Kepanjangan CSS adalah singkatan dari Cascading Style Sheets, yang berguna untuk menyederhanakan proses pembuatan website dengan mengatur elemen di bahasa markup. Pemakaian CSS adalah untuk mendesain website front end. 01 You can enter a subtitle here if you need it
  • 8. Fungsi ● Halaman lebih cepat dimuat ● Mempercepat proses desain ● Mengatur style dalam website
  • 9. Eksternal Internal Inline Penulisan CSS CSS External CSS adalah kode CSS yang dituliskan terpisah dengan file HTML, dan ditulis sendiri pada file ekstensi .css Internal CSS adalah kode CSS yang penulisannya dalam tag <style> dan posisinya ada pada bagian atas header file HTML. Jenis yang terakhir ini langsung memasukkan kode CSS yang ditulis pada setiap atribut HTML.
  • 10. Cara kerja CSS sebenarnya cukup simpel. Mengingat default CSS memakai Bahasa Inggris berbasis syntax dengan struktur yang terbilang sederhana, yakni selector dan declaration block. Cara Kerja CSS
  • 11. Contoh <p>This is a paragraph.</p>. <style> p { color: green; text-weight: bold; } <style> <style> body { background-color: pink; } h1 { font-family: verdana; font-size: 20px; } </style>