SlideShare uma empresa Scribd logo
1 de 14
MEMFORMAT
HALAMANWEB
DANTEKS
Amiroh, S.Kom
SMKN 3 JOMBANG
Tag Judul (Heading)
 Untuk menuliskan judul suatu paragraf
<hn>Judul paragraf</hn>
 n = 1,2,3,4,5,6 (tingkat judul)
<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>
Tag Paragraph)
 Untuk menandai suatu paragraf.
 Suatu paragraf akan terlihat
dibatasi oleh satu baris kosong
sebelum dan sesudahnya
<p>paragraf</p>
<p> Ini adalah homepage pertama
saya, karena saya baru belajar
tentang cara membuat homepage.
</p>
<p>Homepage ini masih dalam
tahap pengembangan, oleh
karena itutampilannya masih
terlalu sederhana.</p>
<p>Saya akan berusaha untuk
terus memperbaiki homepage
saya ini, sehingga semakin
lama semakin menarik untuk
dilihat.</p>
Ini adalah homepage pertama saya,
karena saya baru belajar tentang cara
membuat homepage.
Homepage ini masih dalam tahap
pengembangan, oleh karena itu
tampilannya masih terlalu sederhana.
Saya akan berusaha untuk terus
memperbaiki homepage saya ini,
sehingga semakin lama semakin menarik
untuk dilihat.
Tag Bold/Underline/ Italic
Untuk menandai bagian kalimat agar dicetak tebal,
miring, dan/atau digarisbawahi.
Kata dapat dicetak tebal, miring, garis bawah, tebal
miring, dan kombinasi di tengah huruf normal
<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>
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 = x1
2 + x2
2 + 2x1x2
2H2 + O2 = 2 H2O
Superscript & Subscript
Untuk pindah ke baris berikutnya.
<br>
Bentuk penulisan lain yang dianjurkan (XML style) :
<br/>
Perkenalkan,
nama saya ..... Ini adalah
homepage pertama saya,
karena saya baru belajar tentang cara
membuat homepage.
Homepage ini masih dalam tahap
pengembangan,
oleh karena itu tampilannya masih terlalu
sederhana.
Paragraf
Paragraf
Ganti baris
<p>Perkenalkan,<br />
nama saya ..... Ini
adalah<br />homepage
pertama saya,<br /> karena
saya baru belajar tentang
cara<br />
membuat homepage.</p>
<p>Homepage ini masih
dalam tahap pengembangan,
oleh karena itu
tampilannya masih terlalu
sederhana.</p>
Tag Font (Size)
Memformat suatu bagian kalimat dengan ukuran, jenis
huruf, atau warna tertentu.
Tag : font Atribut : size, face, color
Ukuran
satu, dua, tiga, empat, lima,
enam,tujuh
Ukuran <br>
<font size="1">satu,</font>
<font size="2">dua,</font>
<font size="3">tiga,</font>
<font size="4">empat,</font>
<font size="5">lima,</font>
<font size="6">enam,</font>
<br>
<font size="7">tujuh</font>
<font size="n"> kalimat </font>
<font size="m"> kalimat </font>
n = 1, 2, 3, 4, 5, 6, 7 (ukuran huruf)
m = -2, -1, +0, +1, +2, +3, +4 (ukuran huruf)
Font(face)
Memformat suatu bagian kalimat dengan ukuran,
jenis huruf, atau warna tertentu.
Tag : font Atribut : size, face, color
<font face="nama font"> kalimat </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
<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>
Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau
warna tertentu.
Tag : font Atribut : size, face, color
Red
Maroon
Lime
Green
Blue
Navy
Yellow
Fuschia
Aqua
<b><font color="#FF0000">Red</font><br />
<font color="#800000">Maroon</font><br />
<font color="#00FF00">Lime</font><br />
<font color="#008000">Green</font><br />
<font color="#0000FF">Blue</font><br />
<font color="#000080">Navy</font><br />
<font color="#FFFF00">Yellow</font><br />
<font color="#FF00FF">Fuchsia</font><br />
<font color="#00FFFF">Aqua</font></b>
<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)
MEMFORMAT
HALAMANWEB
MEWARNAI
HALAMAN
WEB
 BGCOLOR merupakanAtributTag
<Body> yang digunakan untuk memberi
warna halaman web dengan warna
tertentu.
 Syntax:
<Body bgcolor=“#RRGGBB”>
 Contoh :
<Body bgcolor=“0000FF”>
Halaman web ini berwarna biru
</body>
MEMBERI
BACKGROUND
GAMBAR
 BACKGROUND merupakan Atribut
<body> digunakan untuk mengatur
tampilan background halaman web
berupa gambar.
 Syntax:
<Body background=“namafilegambar”>
 Contoh :
<Body background=“toska.jpg”>
Background Halaman web ini berupa
gambar
</body>
MENGATUR
WARNA
TEKS
DEFAULT
 TEXT adalah atribut <BODY> yang
berfungsi untuk mengatur
tampilan warna teks default
(Keseluruhan) web
 Syntax:
<BodyTEXT=“WarnaText”>
 Contoh:
<Body text=“red”>
Teks default dalam halaman ini akan
berwarna merah
</body>
Latihan
Buatlah sebuah
dokumen html
dengan tampilan
berikut :

Mais conteúdo relacionado

Destaque

10 html multimedia
10 html multimedia10 html multimedia
10 html multimediaAmiroh S.Kom
 
 Pemanfaatan software aplikasi dalam peningkatan kinerja sistem
	Pemanfaatan software aplikasi dalam peningkatan kinerja sistem	Pemanfaatan software aplikasi dalam peningkatan kinerja sistem
 Pemanfaatan software aplikasi dalam peningkatan kinerja sistemAmiroh S.Kom
 
Protocol jaringan komputer
Protocol jaringan komputerProtocol jaringan komputer
Protocol jaringan komputerAmiroh S.Kom
 

Destaque (8)

07 css box model
07 css box model07 css box model
07 css box model
 
10 html multimedia
10 html multimedia10 html multimedia
10 html multimedia
 
Modul2
Modul2Modul2
Modul2
 
Partisi harddisk
Partisi harddiskPartisi harddisk
Partisi harddisk
 
01 how web works
01 how web works01 how web works
01 how web works
 
 Pemanfaatan software aplikasi dalam peningkatan kinerja sistem
	Pemanfaatan software aplikasi dalam peningkatan kinerja sistem	Pemanfaatan software aplikasi dalam peningkatan kinerja sistem
 Pemanfaatan software aplikasi dalam peningkatan kinerja sistem
 
Protocol jaringan komputer
Protocol jaringan komputerProtocol jaringan komputer
Protocol jaringan komputer
 
Menu owerpoint
Menu owerpointMenu owerpoint
Menu owerpoint
 

Semelhante a Utama</font></h1><p><font size="5">Paragraf pertama</font></p> <h2><font face="Arial">Judul Kedua</font></h2> <p><font color="green

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
 
Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTMLRheyz
 
Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTMLRheyz
 
Pert 03 HTML dan Web Programming
Pert 03 HTML dan Web ProgrammingPert 03 HTML dan Web Programming
Pert 03 HTML dan Web ProgrammingPutu Mardika
 
Belajar html
Belajar htmlBelajar html
Belajar htmlMURROBI
 
02 materi dasar html
02 materi dasar html02 materi dasar html
02 materi dasar htmlMenny SN
 
Pemrograman web modul 1 dan 2
Pemrograman web  modul 1 dan 2Pemrograman web  modul 1 dan 2
Pemrograman web modul 1 dan 2Dhan junkie
 

Semelhante a Utama</font></h1><p><font size="5">Paragraf pertama</font></p> <h2><font face="Arial">Judul Kedua</font></h2> <p><font color="green (10)

02 materi html pengolahan format font
02   materi html pengolahan format font02   materi html pengolahan format font
02 materi html pengolahan format font
 
Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTML
 
Tutorial HTML
Tutorial HTMLTutorial HTML
Tutorial HTML
 
Pert 03 HTML dan Web Programming
Pert 03 HTML dan Web ProgrammingPert 03 HTML dan Web Programming
Pert 03 HTML dan Web Programming
 
Belajar html
Belajar htmlBelajar html
Belajar 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
 
Pemrograman web modul 1 dan 2
Pemrograman web  modul 1 dan 2Pemrograman web  modul 1 dan 2
Pemrograman web modul 1 dan 2
 
3.modul css
3.modul css3.modul css
3.modul css
 

Mais de Amiroh S.Kom

Mais de Amiroh S.Kom (16)

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
 
06 css background
06 css background06 css background
06 css background
 
04 html styling
04 html styling04 html styling
04 html styling
 
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
 
Komponen jaringan
Komponen jaringanKomponen jaringan
Komponen jaringan
 
Topologi jaringan komputer
Topologi jaringan komputerTopologi jaringan komputer
Topologi jaringan komputer
 
Melakukan instalasi os xp
Melakukan instalasi os xpMelakukan instalasi os xp
Melakukan instalasi os xp
 
Setting bios
Setting biosSetting bios
Setting bios
 
Jenis sotware aplikasi
Jenis sotware aplikasiJenis sotware aplikasi
Jenis sotware aplikasi
 

Utama</font></h1><p><font size="5">Paragraf pertama</font></p> <h2><font face="Arial">Judul Kedua</font></h2> <p><font color="green

  • 2. Tag Judul (Heading)  Untuk menuliskan judul suatu paragraf <hn>Judul paragraf</hn>  n = 1,2,3,4,5,6 (tingkat judul) <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. Tag Paragraph)  Untuk menandai suatu paragraf.  Suatu paragraf akan terlihat dibatasi oleh satu baris kosong sebelum dan sesudahnya <p>paragraf</p> <p> Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. </p> <p>Homepage ini masih dalam tahap pengembangan, oleh karena itutampilannya masih terlalu sederhana.</p> <p>Saya akan berusaha untuk terus memperbaiki homepage saya ini, sehingga semakin lama semakin menarik untuk dilihat.</p> Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Saya akan berusaha untuk terus memperbaiki homepage saya ini, sehingga semakin lama semakin menarik untuk dilihat.
  • 4. Tag Bold/Underline/ Italic Untuk menandai bagian kalimat agar dicetak tebal, miring, dan/atau digarisbawahi. Kata dapat dicetak tebal, miring, garis bawah, tebal miring, dan kombinasi di tengah huruf normal <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>
  • 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 = x1 2 + x2 2 + 2x1x2 2H2 + O2 = 2 H2O Superscript & Subscript
  • 6. Untuk pindah ke baris berikutnya. <br> Bentuk penulisan lain yang dianjurkan (XML style) : <br/> Perkenalkan, nama saya ..... Ini adalah homepage pertama saya, karena saya baru belajar tentang cara membuat homepage. Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana. Paragraf Paragraf Ganti baris <p>Perkenalkan,<br /> nama saya ..... Ini adalah<br />homepage pertama saya,<br /> karena saya baru belajar tentang cara<br /> membuat homepage.</p> <p>Homepage ini masih dalam tahap pengembangan, oleh karena itu tampilannya masih terlalu sederhana.</p>
  • 7. Tag Font (Size) Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Atribut : size, face, color Ukuran satu, dua, tiga, empat, lima, enam,tujuh Ukuran <br> <font size="1">satu,</font> <font size="2">dua,</font> <font size="3">tiga,</font> <font size="4">empat,</font> <font size="5">lima,</font> <font size="6">enam,</font> <br> <font size="7">tujuh</font> <font size="n"> kalimat </font> <font size="m"> kalimat </font> n = 1, 2, 3, 4, 5, 6, 7 (ukuran huruf) m = -2, -1, +0, +1, +2, +3, +4 (ukuran huruf)
  • 8. Font(face) Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Atribut : size, face, color <font face="nama font"> kalimat </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 <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>
  • 9. Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atau warna tertentu. Tag : font Atribut : size, face, color Red Maroon Lime Green Blue Navy Yellow Fuschia Aqua <b><font color="#FF0000">Red</font><br /> <font color="#800000">Maroon</font><br /> <font color="#00FF00">Lime</font><br /> <font color="#008000">Green</font><br /> <font color="#0000FF">Blue</font><br /> <font color="#000080">Navy</font><br /> <font color="#FFFF00">Yellow</font><br /> <font color="#FF00FF">Fuchsia</font><br /> <font color="#00FFFF">Aqua</font></b> <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)
  • 11. MEWARNAI HALAMAN WEB  BGCOLOR merupakanAtributTag <Body> yang digunakan untuk memberi warna halaman web dengan warna tertentu.  Syntax: <Body bgcolor=“#RRGGBB”>  Contoh : <Body bgcolor=“0000FF”> Halaman web ini berwarna biru </body>
  • 12. MEMBERI BACKGROUND GAMBAR  BACKGROUND merupakan Atribut <body> digunakan untuk mengatur tampilan background halaman web berupa gambar.  Syntax: <Body background=“namafilegambar”>  Contoh : <Body background=“toska.jpg”> Background Halaman web ini berupa gambar </body>
  • 13. MENGATUR WARNA TEKS DEFAULT  TEXT adalah atribut <BODY> yang berfungsi untuk mengatur tampilan warna teks default (Keseluruhan) web  Syntax: <BodyTEXT=“WarnaText”>  Contoh: <Body text=“red”> Teks default dalam halaman ini akan berwarna merah </body>