STRUKTUR DASAR HTML. Presented by: Moh. Sulhan 2009

Ukuran: px

Mulai penontonan dengan halaman:

Download "STRUKTUR DASAR HTML. Presented by: Moh. Sulhan 2009"

Leony Hermawan
6 tahun lalu
Tontonan:

1 STRUKTUR DASAR HTML Presented by: Moh. Sulhan : 2009

2 Stuktur Dasar HTML Ekstensi / nama ahiran dari file adalah :.html /.htm Tag HTML tidak bersifat case sensitive Struktur dasar HTML adalah : <HTML> awal tag.. akhir tag

3 <HTML> <HEAD> </HEAD> Diskripsi Dokumen Isi Dokumen <HTML> <HEAD> <TITLE> Struktur HTML </TITLE> </HEAD> Selamat Datang di Homepage Pertamaku

5 Macam-macam Tag pada HTML Heading sebuah dokumen dimulai dan dipisah oleh heading Paragraf Membuat Paragraf Elemen Blok dari isi page yg merupakan materi yg dikutip BR Line Break HR Membuat garis batas horisontal Font menentukan format tampilan font Karakter Khusus menampilkan karakter-karakter khusus List item mengelompokkan data baik berurutan atau tidak berurutan Hyperlink Membuat suatu link Tabel membuat tabel Image menambahkan gambar Form membuat lembaran formulir Frame membagi jendela browser menjadi beberapa bagian

6 HEADING <HTML> <H1>Heading Level1</H1> <H2>Heading Level2</H2> <H3>Heading Level3</H3> <H4>Heading Level4</H4> <H5>Heading Level5</H5> <H6>Heading Level6</H6>

<HTML> <H3>Pandai Bersyukur</H3> <P> Tidak usah risau terhadap nikmat yang belum ada, justru risaulah kalau nikmat yang ada tidak disyukuri </P> <H2>Hidup Bersahaja</H2>

7 <HTML> <H3>Pandai Bersyukur</H3> <P> Tidak usah risau terhadap nikmat yang belum ada, justru risaulah kalau nikmat yang ada tidak disyukuri </P> <H2>Hidup Bersahaja</H2> <P> Bersahaja itu bukan berarti sederhana tetapi menafkahkan harta dengan tidak berlebihan untuk memuaskan nafsunya dan juga tidak kikir dalam berbuat kebaikan. </P> PARAGRAF

8 Elemen Blok 1 <HTML> <H3> Sabar Ketika Lapang </H3> <Blockquote> Kita harus senantiasa berhati-hati jangan sampai amal kita yang sedikit menjadi hangus karena kebusukan hati. </Blockquote>

9 Elemen Blok 2 <HTML> <PRE> Pesan Sabar : Dan ujian kesabaran terberat adalah ketika kita mendapatkan pujian. Ingat! setiap pujian yang tidak dikembalikan kepada Allah "maka itulah yang disebut ujub" by:rumi Suwardiyati diyatimail@yahoo.co.id </PRE>

10 <HTML> <p>hal penting bagi kita yg perlu diketahui adalah kunci kesuksesan : </p> 1. Mau bekerja keras <br> 2. Didisplin <br> 3. Bersabar<br> BR

11 Tag HR dan Atributnya - Tag <HR> digunakan untuk membuat garis batas horizontal. - Tag <HR> sekaligus akan membuat baris baru. - Tag ini mempunyai beberapa attribute sebagai berikut : Atribut ALIGN WIDTH SIZE NOSHADE COLOR Fungsi Merupakan posisi vertical garis pemisah. Nilainya adalah LEFT, RIGHT Atau CENTER Lebar dari garis batas. Nilai yang dimasukkan dapat berupa pixel ataupun persen dari lebar jendela browser. Menentukan tebal garis batas. Menonaktifkan efek tiga dimensi. Menentukan warna garis batas

12 HR <HTML> Garis Batas Biasa<HR> Garis di posisi tengah <HR Align=center width=150> Garis di posisi kanan <HR Align=right width=250> Garis di posisi kiri <HR Align=left width=250> Garis tanpa efek 3 dimensi <HR NOSHADE> Garis dengan warna tertentu <HR COLOR=#7433FF>

Memformat Teks Logical Formatting Logical format akan menerapkan layout dokumen secara logis Physical Formatting Physical format adalah format

13 Memformat Teks Logical Formatting Logical format akan menerapkan layout dokumen secara logis Physical Formatting Physical format adalah format terhadap fisik suatu font Font digunakan untuk menentukan format tampilan font dalam document HTML Karakter Khusus menampilkan karakter-karakter khusus

14 Logical Formatting <HTML> <CITE>PHP</CITE> uadalah Pemrograman web yang bersifat server site.<br><br> Perintah pada php untuk mengetahui aktif tidaknya PHP adalah <CODE> phpinfo();</code><br><br> Istilah <EM>E-EDUCATION</EM> dikenal sbg program pendidikan dg memanfaatkan internet Aplikasi Web server yg biasa digunakan PHP adalah <KBD>Apache Web Server</KBD><br><br> Pada Abjad tedapat 5 huruf vokal, yaitu: <SAMP>AEIUOU</SAMP><br><br> Hal yang terpenting bagi pelajar adalah <Strong>BELAJAR</STRONG><br><br> <DFN>ILMU</DFN> adalah harta yang paling berharga

<HTML> <PRE> <B>Teks ini dicetak Tebal</B> <i>teks ini dicetak Miring</i> <U>Teks ini dicetak dg garis bawah</u> <STRIKE> Teks ini dicetak dg garis di tengah teks </STRIKE> <BIG> Teks ini dicetak dg

15 <HTML> <PRE> <B>Teks ini dicetak Tebal</B> <i>teks ini dicetak Miring</i> <U>Teks ini dicetak dg garis bawah</u> <STRIKE> Teks ini dicetak dg garis di tengah teks </STRIKE> <BIG> Teks ini dicetak dg ukuran lebih besar dari normal </BIG> <SMALL> Teks ini dicetak dg ukuran lebih besar dari normal </SMALL> Teks ini adalah <SUB>subscript</SUB> Teks ini adalah <SUP>superscript</SUP> </PRE> Physical Formatting

16 FONT Attribute Description Color Untuk menentukan warna font, anda bisa menggunakan nama font atau hexadecimal(# #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. COLOR Hexadecimal #FF0000 Red #00FF00 Green #0000FF Blue # Black #FFFFFF White Color Bentuk standar penulisannya adalah : <FONT [COLOR=warna]> </FONT>

17 FONT SIZE Attribut yang digunakan untuk menentukan ukuran dari teks, yang mempunyai standar ukuran font 1-7. Bentuk standar penulisannya adalah : <FONT [SIZE=ukuran]> </FONT> FACE Attribut yang digunakan untuk menentukan jenis font dari teks, Jenis font yang sering digunakan diantaranya adalah : Times New Roman, Arial, Sans-serif, Courier New, Verdana, Monotype Corsiva. Bentuk standar penulisannya adalah : <FONT [FACE= namafont ]> </FONT>

FONT <HTML> <CENTER> <p>penggunaan TAG FONT DAN ATTRIBUTNYA</p> <Font Face="Times New Roman" Size=1 COLOR=#FF0000> Times New Roman</font><br><br> <Font Face="Arial" Size=2 >Arial</font><br><br> <Font

18 FONT <HTML> <CENTER> <p>penggunaan TAG FONT DAN ATTRIBUTNYA</p> <Font Face="Times New Roman" Size=1 COLOR=#FF0000> Times New Roman</font><br><br> <Font Face="Arial" Size=2 >Arial</font><br><br> <Font Face="Sans-serif" Size=3 >Sans-serif</font><br><br> <Font Face="Courier New" Size=4 >Courier New</font><br><br> <Font Face="Verdana" Size=5 >Verdana</font><br><br> <Font Face="Monotype Corsiva" Size=6 > Monotype Corsiva</font><br><br> </CENTER>

19 Karakter Khusus Simbol Karakter º ¼ ½ ¾ ¼ ½ ¾ π П < > < > & &

20 <HTML> <HEAD> <TITLE>Karakter Khusus</TITLE> </HEAD> <PRE> Air yang dibutuhkan kira - kira 70 C Luas lingkaran adalah πr<sup>2</sup> </PRE> Karakter Khusus

dokumen-dokumen yang mirip

Copyright 2015

Copyright 2015 HYPERTEXT MARKUP LANGUAGE (HTML) Asep Herman Suyanto info@bambutechno.com http://www.bambutechno.com A. Pengenalan HTML HTML merupakan bahasa yang digunakan untuk menulis halaman web. Biasanya mempunyai