Dasar HTML.docx
-
Upload
nurul-izza-rahmaniya -
Category
Documents
-
view
12 -
download
0
Transcript of Dasar HTML.docx
BELAJAR HTMLReferensi : http://www.w3schools.com/
1. Dasar HTMLStruktur dasar dokumen HTML
Judul Halaman
Belajar Dasar HTMLMulailah dengan niat :D
DOCTYPE: Deklarasi yang mendefinisikan sebuah dokumen bertipe HTML.Teks antara and: Tempat menulis dokumen HTML.Teks antara and: Berisi informasi tentang dokumen.Teks antara and: Tempat menuliskan judul halaman yang akan tampil pada tab.Teks antara and: Tempat menuliskan konten/isi halaman.Teks antara and: Judul konten.Teks antaraand: Paragraf.
1.1 Heading
Pakai h1 paling besarPakai h2 lebih kecil dari h1Pakai h3 lebih kecil dari h2Pakai h4 lebih kecil dari h3Pakai h5 lebih kecil dari h4Cuma sampai h6, gak ada h7
1.2 Paragraf
Ini namanya paragraf.Ini namanya paragraf.Ini namanya paragraf.
1.3 Links
Menuju puddak Klik disini
Tag : Atribut : href
1.4 Images
Tag : imgAtribut : src (source file/nama file image), alt (alternatif teks), width height (ukuran)Catatan : file image harus diletakkan dalam satu folder dengan dokumen html nya.
2. Element HTML HTML element ditulis dengan struktur : konten
Namun ada beberapa element yang tidak memerlukan closing tag, ex :
tag line break
Berikut ini beberapa element HTML :START TAGISI KONTENCLOSING
TAG
Whole dokumen HTML
Tubuh dokumen
Heading
Paragraf
Empty html element (Tidak perlu konten dan closing tag) HTML
element tidak bersifat case sensitive, sehingga sama artinya dengan
Sebuah HTML element dapat dituliskan didalam element yang lain
(nested element). Misalkan pada contoh dibawah ini, terdapat 4
elemen HTML.
Pakai h1 paling besar
Ini memakai h2ini memakai h2
Ini memakai h2ini memakai h2ini memakai h23. Atribut HTML Elemen
HTML dapat memiliki atribut. Atribut memberikan informasi tambahan
tentang elemen. Atribut selalu ditentukan dalam tag awal. Penulisan
atribut | nama atribut = value.3.1 Atribut Lang Atribut untuk
mendeklarasikan bahasa. Kegunaan atribut ini penting bagi aplikasi
pembaca layar maupun search engine.My First HeadingMy first
paragraph.3.2 Atribut Title Atribut untuk mendeklarasikan
judulPuddak GresikPudak adalah makanan atau kue Kabupaten
Gresik-Jawa Timur. Makanan ini terbuat dari bahan tepung beras,
gula pasir/gula jawa dan santan kelapa yang dimasukkan kemasan yang
disebut "Ope" yaitu pelepah daun pinang.Coba arahkan mouse
nya ke paragraf. Value dari atribut tittle akan muncul sebagai
tooltip.3.3 Atribut HrefMenuju puddak Klik disini Bisa juga
ditulis :href=http://puddak.blogspot.com (Tanpa Petik)3.4 Atribut
Size Atribut : src (source file/nama file image) , width height
(ukuran)3.5 Atribut Alt Atribut alt menentukan sebuah teks
alternatif yang akan digunakan ketika sebuah elemen HTML tidak
dapat ditampilkan. (Agar dapat dibaca oleh Screen Reader)4. Style
HTML Setiap elemen HTML memiliki gaya standar (warna latar belakang
putih dan warna teks hitam). Mengubah gaya standar elemen HTML
dapat dilakukan dengan atribut style.4.1 Background Color Contoh
ini mengubah warna background standar dari putih ke biru.Judul
HalamanBelajar Dasar HTMLMulailah dengan niat :D4.2 Text Color
Contoh ini mengubah warna text dari hitam ke hijau dan merahJudul
HalamanBelajar Dasar HTMLMulailah dengan niat :D4.3 Font Color
Digunakan untuk mengubah style font dengan properti
font-familyBelajar Dasar HTMLMulailah dengan niat :D4.4 Font Size
Digunakan untuk mengubah ukuran font dengan atribut
font-sizeBelajar Dasar HTMLMulailah dengan niat :D4.5 Text
Alignment Untuk perataan teks, digunakan property text-alignBelajar
Dasar HTMLMulailah dengan niat :D5. HTML Formatting Berikut ini
adalah element formatting pada HTML :NamaKegunaanElementBold
textTulisan tebal (tanpa tambahan).Important textTulisan tebal
yang ditekankan.Italic textTulisan miring.Emphasized textTulisan
miring yang ditekankan.Marked textMarked / highlight pada
tulisan.Small textTulisan menjadi kecil.Deleted textTulisan menjadi
strikethrough / Tulisan yang tengahnya dicoret.Inserted
textUnderline pada tulisan.SubscriptsEfek subscripts pada
tulisan.SuperscriptsEfek superscripts pada tulisan. Lihat
perbedaannya pada contoh berikut :Aku Tulisan NormalAku Memakai
BoldAku Memakai StrongAku Memakai ItalicAku Memakai
EmphasizedAku Memakai MarkedAku Memakai Small, Jadi kecil kan?Aku
Memakai Deleted, Lihat garis di tengahkuAku Memakai Inserted, Untuk
membuat efek garis bawahAku Memakai Subscripts, Lihat bedanya ?Aku
Memakai Superscripts, Betapa supernya aku