diff --git a/HTML/046 HTML Figure/README.md b/HTML/046 HTML Figure/README.md new file mode 100644 index 0000000..fb65d23 --- /dev/null +++ b/HTML/046 HTML Figure/README.md @@ -0,0 +1,49 @@ +# HTML Figure + +## Apa itu HTML Figure? + +HTML Figure merupakan semantic HTML5 yang digunakan untuk menandai atau menjelaskan sebuah konten. Element `
` juga dapat memberitahukan kepada browser bahwa dia adalah sebuah wadah yang menampung beberapa element yang memiliki hubungan satu sama lain. + +Konten yang ada di dalam `
` biasanya terdiri dari gambar dan `
` sebagai keterangan. + +```html +
+ kucing oren +
Kucing oren
+
+``` + +Maka hasilnya seperti ini: + +![HTML Figure](contoh-gambar.png) + +## Contoh kode + +Selain gambar, element `
` juga dapat menyimpan video, barisan kode, kutipan dan lain-lain. + +Contoh barisan kode: + +```html +
+ 
+     
+        p {
+        color: green;
+        }
+      
+
+
contoh memberikan warna teks dengan CSS
+
+``` + +Contoh kutipan: + +```html +
+
Ali bin Abi Thalib berkata:
+
+ Janganlah engkau mengucapkan perkataan yang engkau sendiri tak suka + mendengarnya jika orang lain mengucapkannya kepadamu. +
+
+``` diff --git a/HTML/046 HTML Figure/contoh-gambar.png b/HTML/046 HTML Figure/contoh-gambar.png new file mode 100644 index 0000000..d5685d2 Binary files /dev/null and b/HTML/046 HTML Figure/contoh-gambar.png differ diff --git a/HTML/046 HTML Figure/index.html b/HTML/046 HTML Figure/index.html new file mode 100644 index 0000000..4f4e724 --- /dev/null +++ b/HTML/046 HTML Figure/index.html @@ -0,0 +1,30 @@ + + + + + + + Document + + + + +
+ kucing oren +
Kucing oren
+
+ + diff --git a/HTML/046 HTML Figure/kucing-oren.jpg b/HTML/046 HTML Figure/kucing-oren.jpg new file mode 100644 index 0000000..b17d27d Binary files /dev/null and b/HTML/046 HTML Figure/kucing-oren.jpg differ