FORMAT TEKS PADA HTML

FORMAT TEKS PADA HTML

Ini merupakan lanjutan dari posting saya yang sebelumnya mengenai belajar HTML, bagi yang masih kurang memahami tulisan saya ini atau ingin mengetahui saja mengenai struktur dasar penulisan HTML ada baiknya melihat tulisan sebelumnya.

Adapun format teks yang digunakan dalam HTML antara lain :

Line Break / Page Break

Berfungsi sebagai pengganti baris dan tidak memiliki element penutup

Sintaks:

<br>

Paragraph

Berguna sebagai pengganti paragraf yang diikuti dengan baris kosong pada awal dan akhir paragraph. Memiliki panutup </p> yang bersifat optional, maksudnya dapat tidak digunakan dengan kompensasi paragraf tidak akan diikuti baris kosong pertanda akhir paragraf. Memiliki attribute “align” yang bernilai “left”,”center” dan “right”.

Sintaks:
<p align=”left”|”center”|”right”>
……………………..
</p>

Block Level Element (Header)

Element H terdiri dari H1,H2,H3,H4,H5,H6 berfungsi untuk membuat header dengan format 6 jenis ukuran huruf dan tercetak tebal. Nilai ukuran huruf terbersar adalah H1 seterusnya sampai yang terkecil adalah H6. Element ini memiliki attribute “align” yang bernilai “left”,”center” dan “right” yang menspesifikasikan posisi horizontal dari header dengan defaultnya adalah left.

Sintaks:
<hx align=”left”|”center”|”right”>
……………………..
</hx>

x merupakan ukuran dari 1 sampai 6

Ini Heading-1

Ini Heading-2

Ini Heading-3

Ini Heading-4

Ini Heading-5

Preformated text

Element ini akan menampilkan teks seperti apa adanya, maksudnya akan tampilk seperti apa yang kita tulis.

Sintaks:
<pre>
……………………..
</pre>

Center

Berfungsi untuk menampilkan teks dalam posisi horizontal ditengah.

Sintaks:
<center>
……………………..
</center>

Basefont

Element ini berfungsi untuk mengubah dasar ukuran tampilan dari web browser. Attribute dari element ini adalah “size” yang merupakan ukuran huruf, bernilai dari “1” sampai dengan “7” pixel, atau berupa ukuran relative (+ atau -), default dari basefont adalah “3” pixel dan element ini tidak memerlukan penutup.

Sintaks:
<basefont size=”pixel”>

Horizontal Rule

Berfungsi untuk membuat satu garis horizontal tidak memiliki penutup dan memiliki attribute align, size(ukuran), width (lebar) dan noshade (garis solid)

Sintaks:
<hr align=”left”|”center”|”right” size=”pixel” width=”persen” noshade>

Attribute	Description
Position	Menentukan posisi dari HR, dengan value : center | right | left
Width	Untuk menentukan panjang HR default 100%
Size	Untuk menentukan tebal dari HR dalam pixel
Noshand	Efek bayangan

Hyperlink

Link Address

1. Absolute Link Address merupakan alamat pada internet (URL) yang meliputi protocol, network location dan patch dan nama file.

Contoh:

http://sevli024.wordpress.com

2. Relatif Address, URL yang tidak menyebutkan protocol dan network location atau hanya patch dan nama file

Anchor

Anchor tag <A> untuk menentukan hyperlink dalam document HTML. HREF property digunakan untuk menentukan tujuan dari hyperlink tersebut

<A HREF=”URL”> Hypertext </A>

<A HREF=”protocol://host.domain:port/path/filename”> Hypertext </A>

Daftar Urutan

Daftar Urutan digunakan untuk mengelompokkan data baik yang berurutan (ordered list) maupun yang tidak berurutan (unordered list).

Ada dua macam list pada HTML

1. Unordered List (Bullet)

Sintaks ordered list:
<ol start=”number” type=”A”|”a”|”I”|”i”|”1″>
……………………
</ol>

2. Ordered List (Numbering)

Sintaks:
<ul type=”circle”|”square”|”disc”>
……………………..
</ul>

Tag	Attribute	Value	Description
<UL>	TYPE	SQUARE DISC CIRCLE	Bullet Kotak Bullet Titik Bullet Lingkaran

Tag	Attribute	Value	Description
<OL>	TYPE	I i A a	Upper Roman Lower Roman Uppercase Lowercase
<OL>	START	N	Begin Number

ELEMENT LI (List Item)
Element LI merupakan isi dari pada daftar. Element ini harus berada di dalam element OL atau UL. Element ini mempunyai attribute type dan value. Nilai attribute type adalah A,a,I,i,1,circle,square,disc dan attribute value berisikan nilai nomor urutan dari attribute type.

Sintaks list item:
<li type=”A”|”a”|”I”|”i”|”1″|”circle”|”square”|”disc”>
……………………..
</li>

Definition List

Definition List terdiri diapit oleh tag <DL> … </DL> dan <DT> tag menentukan definition

term serta <DD> tag menentukan definition itu sendiri.

Font

Elemen font berfungsi mengubah tampilan dari font yang digunakan seperti warna, jenis, ukuran dan jenisnya.

Sintaks:

<font color=”warna” face=”font” size=”pixel”>
……………………..
</font>

Attribute	Description
Color	Untuk menentukan warna font, anda bisa menggunakan nama font atau hexadecimal (#000000 - #ffffff)
Size	Untuk menentukan ukuran dari font 1 – 7
Face	Untuk menentukan jenis font biasanya dalam satu list ada beberapa font dan akan di baca mulai dari yang paling kiri

Attribute penting yang dapat digunakan untuk berbagai keperluan pada HTML

Color

Color merupakan attribute yang dapat ditambahkan pada element body, font, link dan lainnya. Color diwakili dua digit hexadecimal number.

Hexadecimal	Color
#FF0000	Red
#00FF00	Green
#0000FF	Blue
#000000	Black
#FFFFFF	White

Alignment

Align attribute digunakan untuk menentukan perataan object pada document HTML baik berupa teks, object, image, paragraph, division dan lain lain.

Value	Description
Left	Rata Kiri
Right	Rata Kanan
Center	Rata Tengah
Justify	Rata kanan kiri

Format Text

Physical Formating

Tag	Description
<B> … </B>	Bold text
<I> … </I>	Italic text
<U> … </U>	Underline Text
<BIG> … </BIG>	Untuk ukuran yang lebih besar dari normal
<SMALL> … </SMALL>	Untuk ukuran yang lebih kecil dari normal
<STRIKE> … </STRIKE>	Untuk member garis di tengah text
<SUP> … </SUP>	Superscript text
<SUB> … </SUB>	Subscript text
<CENTER> … </CENTER>	Center document

Logical Formating

Tag	Description
<EM> … </EM>	Text miring / <I>
<STRONG> … </STRONG>	Text tebal
<DEL> … </DEL>	Mencoret text / <STRIKE>
<INS> … </INS>	Underline text / <U>