SlideShare a Scribd company logo
1 of 10
<h1>Judul   Tingkat   1</h1>
<h2>Judul   Tingkat   2</h2>
<h3>Judul   Tingkat   3</h3>
<h4>Judul   Tingkat   4</h4>
<h5>Judul   Tingkat   5</h5>
<h6>Judul   Tingkat   6</h6>
 Untuk menandai suatu paragraf.
  Suatu paragraf akan terlihat dibatasi oleh satu baris
  kosong sebelum dan sesudahnya
 <p>paragraf</p>                  Ini adalah homepage pertama saya,
                                   karena saya baru belajar tentang cara
<p> Ini adalah homepage pertama    membuat homepage.
  saya, karena saya baru belajar
  tentang cara membuat homepage.
</p>                               Homepage ini masih dalam tahap
<p>Homepage ini masih dalam        pengembangan, oleh karena itu
  tahap pengembangan, oleh         tampilannya masih terlalu sederhana.
  karena itutampilannya masih
  terlalu sederhana.</p>
<p>Saya akan berusaha untuk        Saya akan berusaha untuk terus
  terus memperbaiki homepage       memperbaiki homepage saya ini,
  saya ini, sehingga semakin
  lama semakin menarik untuk       sehingga semakin lama semakin menarik
  dilihat.</p>                     untuk dilihat.
Untuk menandai bagian kalimat agar dicetak tebal, miring,
dan/atau digarisbawahi.
           <b>Kalimat yang dicetak tebal</b>
          <i>Kalimat yang dicetak miring</i>
          <u>Kalimat yang digarisbawahi</u>
  <p>Kata dapat dicetak <b>tebal</b>, <i>miring</i>,
  <u>garis bawah</u>, <b>tebal <i>miring</i></b>, dan
  <b><i><u>kombinasi</u></i></b> di tengah huruf
  normal</p>

  Kata dapat dicetak tebal, miring, garis bawah,
  tebal miring, dan kombinasi di tengah huruf
  normal
Untuk menandai bagian karakter agar dicetak tinggi atau
rendah, biasanya untuk rumus matematika atau kimia.
 <sup>bagian yang dicetak tinggi</sup>
 <sub>bagian yang dicetak rendah</sub>
   <p>(x<sub>1</sub> + x<sub>2</sub>)<sup>2</sup> =
   x<sub>1</sub><sup>2</sup> +
   x<sub>2</sub><sup>2</sup> +
   2x<sub>1</sub>x<sub>2</sub></p>


                  (x1 + x2)2 = x12 + x22 + 2x1x2

                  2H2 + O2 = 2 H2O
Untuk pindah ke baris berikutnya.
                <br>
                Bentuk penulisan lain yang dianjurkan (XML style) :
                <br/>                              Ganti baris
<p>Perkenalkan,<br />
nama saya ..... Ini          Perkenalkan,
adalah<br />homepage         nama saya ..... Ini adalah
pertama saya,<br /> karena
                             homepage pertama saya,
saya baru belajar tentang                                                Paragraf
cara<br />                   karena saya baru belajar tentang cara
membuat homepage.</p>        membuat homepage.

<p>Homepage ini masih        Homepage ini masih dalam tahap
dalam tahap pengembangan,    pengembangan,
oleh karena itu                                                               Paragraf
tampilannya masih terlalu    oleh karena itu tampilannya masih terlalu
sederhana.</p>               sederhana.
Memformat suatu bagian kalimat dengan ukuran, jenis
  huruf, atau warna tertentu.
  Tag : font    Parameter : size, face, color
  <font size="n"> kalimat </font>
  <font size="m"> kalimat </font>
                               n = 1, 2, 3, 4, 5, 6, 7 (ukuran huruf)
Ukuran <br>                    m = -2, -1, +0, +1, +2, +3, +4 (ukuran
<font size="1">satu,</font>            huruf)
<font size="2">dua,</font>
<font size="3">tiga,</font>    Ukuran
<font size="4">empat,</font>
<font size="5">lima,</font>
                               satu,   dua,   tiga, empat, lima,
<font size="6">enam,</font>
<br>
<font size="7">tujuh</font>
                               enam, tujuh
Memformat suatu bagian kalimat dengan ukuran, jenis
   huruf, atau warna tertentu.
   Tag : font Parameter : size, face, color
    <font face="nama font"> kalimat </font>
<font face="Times New Roman">Homepage ini masih dalam tahap
pengembangan</font><br />
<font face="Arial">Homepage ini masih dalam tahap pengembangan</font><br />
<font face="Courier New">Homepage ini masih dalam tahap pengembangan</font><br
/>
<font face="Verdana">Homepage ini masih dalam tahap pengembangan</font>


Homepage ini masih dalam tahap pengembangan
Homepage ini masih dalam tahap pengembangan
Homepage ini masih dalam tahap pengembangan
Homepage ini masih dalam tahap pengembangan
Memformat suatu bagian kalimat dengan ukuran, jenis huruf,
atau warna tertentu.
Tag : font Parameter : size, face, color
<font color="#RRGGBB"> kalimat </font>
RR = 00 .. FF (intensitas warna merah dalam heksadesimal)
GG = 00 .. FF (intensitas warna hijau dalam heksadesimal)
BB = 00 .. FF (intensitas warna biru dalam heksadesimal)
                                                            Red
 <b><font color="#FF0000">Red</font><br />
                                                            Maroon
 <font color="#800000">Maroon</font><br />                  Lime
 <font color="#00FF00">Lime</font><br />                    Green
 <font color="#008000">Green</font><br />                   Blue
 <font color="#0000FF">Blue</font><br />                    Navy
 <font color="#000080">Navy</font><br />
 <font color="#FFFF00">Yellow</font><br />
                                                            Yellow
 <font color="#FF00FF">Fuchsia</font><br />                 Fuschia
 <font color="#00FFFF">Aqua</font></b>                      Aqua
• Buatlah sebuah dokumen html dengan tampilan berikut :

More Related Content

What's hot

What's hot (6)

Tugas CSS
Tugas CSSTugas CSS
Tugas CSS
 
Pemograman WEB (CSS)
Pemograman WEB (CSS)Pemograman WEB (CSS)
Pemograman WEB (CSS)
 
Pemograman WEB (CSS Lanjutan)
Pemograman WEB (CSS Lanjutan)Pemograman WEB (CSS Lanjutan)
Pemograman WEB (CSS Lanjutan)
 
Tutorial web nizar
Tutorial web nizarTutorial web nizar
Tutorial web nizar
 
Modul web-design
Modul web-designModul web-design
Modul web-design
 
HTML Dasar I
HTML Dasar IHTML Dasar I
HTML Dasar I
 

Viewers also liked

Teknik layering adobe
Teknik layering adobeTeknik layering adobe
Teknik layering adobeAmiroh S.Kom
 
Melakukan instalasi os xp
Melakukan instalasi os xpMelakukan instalasi os xp
Melakukan instalasi os xpAmiroh S.Kom
 
Mempersiapkan perbaikan system jaringan komputer
Mempersiapkan perbaikan system jaringan komputerMempersiapkan perbaikan system jaringan komputer
Mempersiapkan perbaikan system jaringan komputerAmiroh S.Kom
 
Mendiagnosis permasalahan jaringan (1)
Mendiagnosis permasalahan jaringan (1)Mendiagnosis permasalahan jaringan (1)
Mendiagnosis permasalahan jaringan (1)Amiroh S.Kom
 
Topologi jaringan komputer
Topologi jaringan komputerTopologi jaringan komputer
Topologi jaringan komputerAmiroh S.Kom
 
Mengisolasi permasalahan pada lan
Mengisolasi permasalahan pada lanMengisolasi permasalahan pada lan
Mengisolasi permasalahan pada lanAmiroh S.Kom
 
02 algoritma percabangan
02 algoritma percabangan02 algoritma percabangan
02 algoritma percabanganViez Ta
 
Mengenal jaringan komputer
Mengenal jaringan komputerMengenal jaringan komputer
Mengenal jaringan komputerAmiroh S.Kom
 
Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11
Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11
Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11Saprudin Eskom
 

Viewers also liked (20)

06 frame
06 frame06 frame
06 frame
 
Teknik layering adobe
Teknik layering adobeTeknik layering adobe
Teknik layering adobe
 
Melakukan instalasi os xp
Melakukan instalasi os xpMelakukan instalasi os xp
Melakukan instalasi os xp
 
Komponen jaringan
Komponen jaringanKomponen jaringan
Komponen jaringan
 
Mempersiapkan perbaikan system jaringan komputer
Mempersiapkan perbaikan system jaringan komputerMempersiapkan perbaikan system jaringan komputer
Mempersiapkan perbaikan system jaringan komputer
 
Mendiagnosis permasalahan jaringan (1)
Mendiagnosis permasalahan jaringan (1)Mendiagnosis permasalahan jaringan (1)
Mendiagnosis permasalahan jaringan (1)
 
Pert0
Pert0Pert0
Pert0
 
Adobe photoshop 3
Adobe photoshop 3Adobe photoshop 3
Adobe photoshop 3
 
07 form
07 form07 form
07 form
 
Adobe photoshop 4
Adobe photoshop 4Adobe photoshop 4
Adobe photoshop 4
 
04 membuat link
04 membuat link04 membuat link
04 membuat link
 
Setting bios
Setting biosSetting bios
Setting bios
 
Adobe photoshop 1
Adobe photoshop 1Adobe photoshop 1
Adobe photoshop 1
 
Topologi jaringan komputer
Topologi jaringan komputerTopologi jaringan komputer
Topologi jaringan komputer
 
Mengisolasi permasalahan pada lan
Mengisolasi permasalahan pada lanMengisolasi permasalahan pada lan
Mengisolasi permasalahan pada lan
 
Adobe photoshop 2
Adobe photoshop 2Adobe photoshop 2
Adobe photoshop 2
 
02 algoritma percabangan
02 algoritma percabangan02 algoritma percabangan
02 algoritma percabangan
 
Keandalan Memori
Keandalan MemoriKeandalan Memori
Keandalan Memori
 
Mengenal jaringan komputer
Mengenal jaringan komputerMengenal jaringan komputer
Mengenal jaringan komputer
 
Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11
Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11
Kunci jawaban soal pbo dan pemrograman desktop ukk smk kelas 11
 

Similar to Tingkat Struktur Dokumen HTML

Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTMLRheyz
 
Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTMLRheyz
 
02 materi dasar html
02 materi dasar html02 materi dasar html
02 materi dasar htmlMenny SN
 
02 materi html pengolahan format font
02   materi html pengolahan format font02   materi html pengolahan format font
02 materi html pengolahan format fontDeka M Wildan
 
Tutoria html mysqdanphp
Tutoria html mysqdanphpTutoria html mysqdanphp
Tutoria html mysqdanphpAfdi Njomplank
 
Tutorial html + my sql + php
Tutorial html + my sql + phpTutorial html + my sql + php
Tutorial html + my sql + phpSaikhu Zaenul
 
Belajar html
Belajar htmlBelajar html
Belajar htmlMURROBI
 
Pemrograman web modul 1 dan 2
Pemrograman web  modul 1 dan 2Pemrograman web  modul 1 dan 2
Pemrograman web modul 1 dan 2Dhan junkie
 

Similar to Tingkat Struktur Dokumen HTML (13)

Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTML
 
Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTML
 
02 materi dasar html
02 materi dasar html02 materi dasar html
02 materi dasar html
 
Pertemuan 07
Pertemuan 07Pertemuan 07
Pertemuan 07
 
Pertemuan 07
Pertemuan 07Pertemuan 07
Pertemuan 07
 
Modul html
Modul htmlModul html
Modul html
 
4.format html (ok)
4.format html (ok)4.format html (ok)
4.format html (ok)
 
3.modul css
3.modul css3.modul css
3.modul css
 
02 materi html pengolahan format font
02   materi html pengolahan format font02   materi html pengolahan format font
02 materi html pengolahan format font
 
Tutoria html mysqdanphp
Tutoria html mysqdanphpTutoria html mysqdanphp
Tutoria html mysqdanphp
 
Tutorial html + my sql + php
Tutorial html + my sql + phpTutorial html + my sql + php
Tutorial html + my sql + php
 
Belajar html
Belajar htmlBelajar html
Belajar html
 
Pemrograman web modul 1 dan 2
Pemrograman web  modul 1 dan 2Pemrograman web  modul 1 dan 2
Pemrograman web modul 1 dan 2
 

More from Amiroh S.Kom

10 html multimedia
10 html multimedia10 html multimedia
10 html multimediaAmiroh S.Kom
 
09 membuat hyperlink
09 membuat hyperlink09 membuat hyperlink
09 membuat hyperlinkAmiroh S.Kom
 
01 Pengenalan Web & Jenis Profesi Di bidang Web
01 Pengenalan Web & Jenis Profesi Di bidang Web 01 Pengenalan Web & Jenis Profesi Di bidang Web
01 Pengenalan Web & Jenis Profesi Di bidang Web Amiroh S.Kom
 
14.tki c2-kikd-x-simulasi digital
14.tki c2-kikd-x-simulasi digital14.tki c2-kikd-x-simulasi digital
14.tki c2-kikd-x-simulasi digitalAmiroh S.Kom
 
Learning of future
Learning of futureLearning of future
Learning of futureAmiroh S.Kom
 
05 teknik pengkabelan
05 teknik pengkabelan05 teknik pengkabelan
05 teknik pengkabelanAmiroh S.Kom
 
Protocol jaringan komputer
Protocol jaringan komputerProtocol jaringan komputer
Protocol jaringan komputerAmiroh S.Kom
 

More from Amiroh S.Kom (20)

16 css menu
16  css menu16  css menu
16 css menu
 
15 membuat list
15  membuat list15  membuat list
15 membuat list
 
14 media query
14  media query14  media query
14 media query
 
13 html5 form
13  html5 form13  html5 form
13 html5 form
 
12 mengenal html5
12 mengenal html512 mengenal html5
12 mengenal html5
 
11 form
11 form11 form
11 form
 
10 html multimedia
10 html multimedia10 html multimedia
10 html multimedia
 
09 membuat hyperlink
09 membuat hyperlink09 membuat hyperlink
09 membuat hyperlink
 
08 insert image
08 insert image08 insert image
08 insert image
 
07 css box model
07 css box model07 css box model
07 css box model
 
06 css background
06 css background06 css background
06 css background
 
05 css
05 css05 css
05 css
 
04 html styling
04 html styling04 html styling
04 html styling
 
02 mengenal html
02 mengenal html02 mengenal html
02 mengenal html
 
01 how web works
01 how web works01 how web works
01 how web works
 
01 Pengenalan Web & Jenis Profesi Di bidang Web
01 Pengenalan Web & Jenis Profesi Di bidang Web 01 Pengenalan Web & Jenis Profesi Di bidang Web
01 Pengenalan Web & Jenis Profesi Di bidang Web
 
14.tki c2-kikd-x-simulasi digital
14.tki c2-kikd-x-simulasi digital14.tki c2-kikd-x-simulasi digital
14.tki c2-kikd-x-simulasi digital
 
Learning of future
Learning of futureLearning of future
Learning of future
 
05 teknik pengkabelan
05 teknik pengkabelan05 teknik pengkabelan
05 teknik pengkabelan
 
Protocol jaringan komputer
Protocol jaringan komputerProtocol jaringan komputer
Protocol jaringan komputer
 

Tingkat Struktur Dokumen HTML

  • 1.
  • 2. <h1>Judul Tingkat 1</h1> <h2>Judul Tingkat 2</h2> <h3>Judul Tingkat 3</h3> <h4>Judul Tingkat 4</h4> <h5>Judul Tingkat 5</h5> <h6>Judul Tingkat 6</h6>
  • 3.  Untuk menandai suatu paragraf. Suatu paragraf akan terlihat dibatasi oleh satu baris kosong sebelum dan sesudahnya  <p>paragraf</p> Ini adalah homepage pertama saya, karena saya baru belajar tentang cara <p> Ini adalah homepage pertama membuat homepage. saya, karena saya baru belajar tentang cara membuat homepage. </p> Homepage ini masih dalam tahap <p>Homepage ini masih dalam pengembangan, oleh karena itu tahap pengembangan, oleh tampilannya masih terlalu sederhana. karena itutampilannya masih terlalu sederhana.</p> <p>Saya akan berusaha untuk Saya akan berusaha untuk terus terus memperbaiki homepage memperbaiki homepage saya ini, saya ini, sehingga semakin lama semakin menarik untuk sehingga semakin lama semakin menarik dilihat.</p> untuk dilihat.
  • 4. Untuk menandai bagian kalimat agar dicetak tebal, miring, dan/atau digarisbawahi. <b>Kalimat yang dicetak tebal</b> <i>Kalimat yang dicetak miring</i> <u>Kalimat yang digarisbawahi</u> <p>Kata dapat dicetak <b>tebal</b>, <i>miring</i>, <u>garis bawah</u>, <b>tebal <i>miring</i></b>, dan <b><i><u>kombinasi</u></i></b> di tengah huruf normal</p> Kata dapat dicetak tebal, miring, garis bawah, tebal miring, dan kombinasi di tengah huruf normal
  • 5. Untuk menandai bagian karakter agar dicetak tinggi atau rendah, biasanya untuk rumus matematika atau kimia. <sup>bagian yang dicetak tinggi</sup> <sub>bagian yang dicetak rendah</sub> <p>(x<sub>1</sub> + x<sub>2</sub>)<sup>2</sup> = x<sub>1</sub><sup>2</sup> + x<sub>2</sub><sup>2</sup> + 2x<sub>1</sub>x<sub>2</sub></p> (x1 + x2)2 = x12 + x22 + 2x1x2 2H2 + O2 = 2 H2O
  • 6. Untuk pindah ke baris berikutnya. <br> Bentuk penulisan lain yang dianjurkan (XML style) : <br/> Ganti baris <p>Perkenalkan,<br /> nama saya ..... Ini Perkenalkan, adalah<br />homepage nama saya ..... Ini adalah pertama saya,<br /> karena homepage pertama saya, saya baru belajar tentang Paragraf cara<br /> karena saya baru belajar tentang cara membuat homepage.</p> membuat homepage. <p>Homepage ini masih Homepage ini masih dalam tahap dalam tahap pengembangan, pengembangan, oleh karena itu Paragraf tampilannya masih terlalu oleh karena itu tampilannya masih terlalu sederhana.</p> sederhana.
  • 7. Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Parameter : size, face, color <font size="n"> kalimat </font> <font size="m"> kalimat </font> n = 1, 2, 3, 4, 5, 6, 7 (ukuran huruf) Ukuran <br> m = -2, -1, +0, +1, +2, +3, +4 (ukuran <font size="1">satu,</font> huruf) <font size="2">dua,</font> <font size="3">tiga,</font> Ukuran <font size="4">empat,</font> <font size="5">lima,</font> satu, dua, tiga, empat, lima, <font size="6">enam,</font> <br> <font size="7">tujuh</font> enam, tujuh
  • 8. Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Parameter : size, face, color <font face="nama font"> kalimat </font> <font face="Times New Roman">Homepage ini masih dalam tahap pengembangan</font><br /> <font face="Arial">Homepage ini masih dalam tahap pengembangan</font><br /> <font face="Courier New">Homepage ini masih dalam tahap pengembangan</font><br /> <font face="Verdana">Homepage ini masih dalam tahap pengembangan</font> Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan Homepage ini masih dalam tahap pengembangan
  • 9. Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Parameter : size, face, color <font color="#RRGGBB"> kalimat </font> RR = 00 .. FF (intensitas warna merah dalam heksadesimal) GG = 00 .. FF (intensitas warna hijau dalam heksadesimal) BB = 00 .. FF (intensitas warna biru dalam heksadesimal) Red <b><font color="#FF0000">Red</font><br /> Maroon <font color="#800000">Maroon</font><br /> Lime <font color="#00FF00">Lime</font><br /> Green <font color="#008000">Green</font><br /> Blue <font color="#0000FF">Blue</font><br /> Navy <font color="#000080">Navy</font><br /> <font color="#FFFF00">Yellow</font><br /> Yellow <font color="#FF00FF">Fuchsia</font><br /> Fuschia <font color="#00FFFF">Aqua</font></b> Aqua
  • 10. • Buatlah sebuah dokumen html dengan tampilan berikut :