03 formatting page and text

Post on 14-Jul-2015

48 views 1 download

Transcript of 03 formatting page and text

MEMFORMAT HALAMAN WEB DAN TEKS

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

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>

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

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>

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)

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>

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)

MEMFORMAT HALAMAN WEB

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>

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>

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>

Latihan

Buatlah sebuahdokumen html dengan tampilanberikut :