Contoh dokumen HTML sederhana

HTML BERJALAN

<html>
<head>
<title>Logo</title>
</head>
<body bgcolor=magenta scrolling=”no”>
<h3><marquee>Selamat Datang di http://studyandsharing.blogspot.com/</marquee></h3>
<h5 align=center > <marquee>Tempat Belajar Kita Bersama</marquee> </h5>
</body>
</html>

HTML Paragraf
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=chine>
<!—Cara membuat paragrap —>
<P>Cara membuat tulisan dengan paragrap 1
<br>dilanjut dengan pindah baris ke dua
<P>Cara membuat tulisan dengan paragrap 2
<br>dilanjut dengan pindah baris ke dua
</body>
</html>

HTML Insert
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=chine>
<P>Cara membuat tulisan menjorok kedalam dengan insert simbol<br>
<ul type=scquare>
<li>No
<li>Tgl
<li>Nama
<li>Instruktur
</ul>
<P>Cara membuat tulisan menjorok kedalam dengan insert angka
<ol type=”I” start=1>
<li>No
<li>Tgl
<li>Nama
<li>Instruktur
</ol>
</body>
</html>

HTML Table
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=chine>
<!—Cara membuat table —>
<P>Cara membuat table
<table border=1 width=100% bgcolor=yellow cellpadding=2>
<caption align=bottom><div align=center><b><i><h2>Jadwal Training</h2></i></b></div></caption>
<tr bgcolor=#008000>
<th>no.<th>tgl<th>Materi<th>Instruktur
</tr>
<tr align=center>
<td>1.<td>2-3-2003<td>Tqs<td>hendry
</tr>
<tr align=center>
<td>2.<td>2-3-2003<td colspan=2 bgcolor=#87ceeb>dua kolom jadi satu
<tr align=center>
<td>3.<td rowspan=2>dua baris jadi satu<td>MQ<td>Huzaini
</tr>
<tr align=center>
<td>4.<td>tqm<td>ismail
</tr>
</table>
<table border=1 width=100% bgcolor=yellow cellpadding=0>
<caption align=top><div align=center><b><i><h2>Jadwal Training</h2></i></b></div></caption>
<tr bgcolor=#008000>
<th>no.<th>tgl<th>Materi<th>Instruktur
</tr>
<tr align=center>
<td>1.<td>2-3-2003<td>Tqs<td>hendry
</tr>
<tr align=center>
<td>2.<td>2-3-2003<td colspan=2 bgcolor=#87ceeb>dua kolom jadi satu
<tr align=center>
<td>3.<td rowspan=2>dua baris jadi satu<td>MQ<td>Huzaini
</tr>
<tr align=center>
<td>4.<td>tqm<td>ismail
</tr>
</table>
</body>
</html>

HTML Gambar
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=magenta text=”#ffffff” link=blue vlink=red alink=”#00ff00″>
<!—Cara membuat tex mengelilingi gambar —>
<a href=tulisan.html> <img width=90 height=30 border=3 src=paint10_title.gif ALT=”gambar corell” align=left ></a><div align=left><font face=”arial”>
<b><font size=+2>D</b></font>alam cerita Ramayana, dikhabarkan dewi Shinta menginginkan Rama untuk menangkap sebuah kijang yang disebut kijang kencana.
Pada awalnya Rama menolak untuk menangkap kijang tersebut.</font></div>
</body>
</html>
HTML Form
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=magenta text=”#ffffff” link=blue vlink=red alink=”#00ff00″>
<!—Cara membuat form —>
<form method=”post”>
Nama
<input type=text name=nama size=30><br>
Alamat
<input type=text name=alamat size=30><br>
<form method=”post”>
Jenis kelamin<br>
Laki-laki
<input type=radio name=jk Value=l><br>
Perempuan
<input type=radio name=jk Value=p><br>
</form>
</body>
</html>
HTML MENU 1
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=cyan align=leff>
<!—Cara membuat tulisan berjalan —>
<ul type=scquare>
<li><a href=paragrap.html target=f1>paragrap</a>
<li><a href=simbol.html target=f1>inset simbol</a>
<li><a href=table.html target=f1>table</a>
<li><a href=gambar.html target=f1>tulisan mengelilingi gambar</a>
<li><a href=form.html target=f1>form</a>
<li><a href=”myprog.idc” target=f1>data peserta</a>
</ul>
</body>
</html>
HTML Java script
<html>
<!— program javaScript pertama —->
<pre>
<b>Obyek pada JavaScript</b>
JavaScript mempunyai <i>obyek hirarkhi</i> yang disebut sebagai”window”.
-Window
-Location
-History
-Document
-Forms
-Anchors
<B>Window</b>
Obyek berisi metoda dan properti yang berinteraksi dengan window  aktual.
Setiap Window dapat merepresentasikan Frame.

<b>Location</B>
Berisi Properti dan metoda yang berkaitan dengan lokasi URL (Universal Resource Locator).

<b>History</b>
Berisi informasi tentang daftar dari history historyb tempat/ URL yang telah dikunjungi.

<b>Documen</b>
obyek yang paling banyak digunakan dalam javaScript, termasuk menggunakan <i>forms, links,
string </i> (teks) dan lainnya.
</pre>
</html>
HTML Menu 2
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<body bgcolor=cyan>
<!—Cara membuat tulisan berjalan —>
<ul type=scquare>
<li><a href=js.html target=f1>JavaScript
</body>
</html>
HTML Frame
<html>
<head>
<title>Tempat Belajar Kita Bersama</title>
</head>
<p style=”font: 12pt arial”>
<frameset cols=25%,50%,25% border=0  scrolling=no>
<frame src=menu1.html>
<frameset rows=20%,* border=0 scrolling=no>
<frame src=logo.html>
<frame src=logo.html name=f1>
</frameset>
<frame src=menu2.html name=f2>
</frameset>
</p>
</html>

Comments

  1. Termakasih atas semua materi yang kakak berikan...sungguh bermamfaat sekali bagi saya.
    Perkenalkan nama saya Rinal , NIM 1922500057 , Kel SI2J . Link website kampus saya http://www.atmaluhur.ac.id/salam budi luhur kak..sekian terimakasih.

    ReplyDelete

Post a Comment