03 formatting page and text

14
MEMFORMAT HALAMAN WEB DAN TEKS Amiroh , S.Kom SMKN 3 JOMBANG

Transcript of 03 formatting page and text

Page 1: 03 formatting page and text

MEMFORMAT HALAMAN WEB DAN TEKS

Amiroh, S.Kom

SMKN 3 JOMBANG

Page 2: 03 formatting page and text

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>

Page 3: 03 formatting page and text

Tag Paragraph)

Untuk menandai suatu paragraf.

Suatu paragraf akan terlihatdibatasi oleh satu baris kosongsebelum 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 caramembuat homepage.

Homepage ini masih dalam tahappengembangan, oleh karena itutampilannya masih terlalu sederhana.

Saya akan berusaha untuk terusmemperbaiki homepage saya ini, sehingga semakin lama semakin menarikuntuk dilihat.

Page 4: 03 formatting page and text

Tag Bold/Underline/ Italic

Untuk menandai bagian kalimat agar dicetak tebal,

miring, dan/atau digarisbawahi.

Kata dapat dicetak tebal, miring, garis bawah, tebalmiring, 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>

Page 5: 03 formatting page and text

Untuk menandai bagian karakter agar dicetak tinggi ataurendah, 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 + x2

2 + 2x1x2

2H2 + O2 = 2 H2O

Superscript & Subscript

Page 6: 03 formatting page and text

Untuk pindah ke baris berikutnya.<br>

Bentuk penulisan lain yang dianjurkan (XML style) :<br/>

Perkenalkan,nama saya ..... Ini adalahhomepage pertama saya,karena saya baru belajar tentang caramembuat homepage.

Homepage ini masih dalam tahappengembangan,oleh karena itu tampilannya masih terlalusederhana.

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>

Page 7: 03 formatting page and text

Tag Font (Size)

Memformat suatu bagian kalimat dengan ukuran, jenishuruf, 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)

Page 8: 03 formatting page and text

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 pengembanganHomepage 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>

Page 9: 03 formatting page and text

Memformat suatu bagian kalimat dengan ukuran, jenis huruf, atauwarna tertentu.Tag : font Atribut : size, face, color

RedMaroonLimeGreenBlueNavyYellowFuschiaAqua

<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)

Page 10: 03 formatting page and text

MEMFORMAT HALAMAN WEB

Page 11: 03 formatting page and text

MEWARNAI HALAMANWEB

BGCOLOR merupakan Atribut Tag <Body> yang digunakan untuk memberiwarna halaman web dengan warnatertentu.

Syntax:

<Body bgcolor=“#RRGGBB”>

Contoh :

<Body bgcolor=“0000FF”>

Halaman web ini berwarna biru

</body>

Page 12: 03 formatting page and text

MEMBERI BACKGROUND GAMBAR

BACKGROUND merupakan Atribut<body> digunakan untuk mengaturtampilan background halaman web berupa gambar.

Syntax:<Body background=“namafilegambar”>

Contoh :<Body background=“toska.jpg”>

Background Halaman web ini berupagambar

</body>

Page 13: 03 formatting page and text

MENGATUR WARNA TEKS DEFAULT

TEXT adalah atribut <BODY> yang berfungsi untuk mengaturtampilan warna teks default (Keseluruhan) web

Syntax:<Body TEXT=“WarnaText”>

Contoh:<Body text=“red”>

Teks default dalam halaman ini akanberwarna merah

</body>

Page 14: 03 formatting page and text

Latihan

Buatlah sebuahdokumen html dengan tampilanberikut :