Minggu, 16 Maret 2014

5 Contoh-Contoh Proses Pembuatan HTML

 
Contoh Membuat tabel Sebagai Berikut:
<html>
<title>buat tabel</title>
<body>
<table border=2 width=50%>
<tr>
<td>No</td>
<td>NIM</td>
<td>Nama</td>
<td>Agama</td>
<td>Matematika</td>
<td>IPA</td>
<td>Total</td>
</tr>
<tr>
<td>1</td>
<td>123</td>
<td>Agus</td>
<td>10</td>
<td>7</td>
<td>9</td>
<td>26</td>
</tr>
<tr>
<td>2</td>
<td>124</td>
<td>Agung</td>
<td>9</td>
<td>9</td>
<td>10</td>
<td>29</td>
</tr>
<tr>
<td>3</td>
<td>125</td>
<td>Hanif</td>
<td>9</td>
<td>8</td>
<td>10</td>
<td>27</td>
</tr>

Contoh Membuat Tabel gabungan sebagai berikut:
<html>
<title>gabung tabel</title>
<body>
<table border=2 width=80% >
<caption><marquee><blink><font size=14 face="arial" color="green">tabel nilai~cek nilai anda dengan tabel ini~</marquee></blink></caption>
<tr>
<td rowspan=2 width=5%><center>No</td>
<td rowspan=2 width=30%><center>Nama</td>
<td colspan=3 width=35%><center>Nilai </td>
<td rowspan=2 width=10%><center>Total</td>
</tr>
<tr>
<td><center>IPA</td>
<td><center>IPs</td>
<td><center>inggris</td>
</tr>
<tr>
<td><center>1</td>
<td><center>Agus</td>
<td><center>10</td>
<td><center>8</td>
<td><center>7</td>
<td><center>25</td>
</tr>
<tr>
<td><center>2</td>
<td><center>Agung</td>
<td><center>10</td>
<td><center>9</td>
<td><center>10</td>
<td><center>29</td>
</tr>
<tr>
<td><center>3</td>
<td><center>Hanif</td>
<td><center>9</td>
<td><center>8</td>
<td><center>10</td>
<td><center>27</td>
</tr>

Contoh  Membuat Formulir/Biodata Sebagai Berikut:
<html>
<title>formulir mahasiswa</title>
<body background="a.jpg">
<caption>DATA MAHASISWA</caption>
<form><pre><font color="yellow">
Nama       : <input type="text" name="textfield">
NIM        : <input type="text" name="textfield">
Alamat     : <input type="text" name="textfield">
Gender     : <input type="radio"name="gender" value="m">Male
             <input type="radio"name="gender" value="f">Female
      <br>
Jurusan    : <select name="select">
          <option value="teknik informatika">teknik informatika</option>
   <option value="manajemen informatika">manajemen informatika</option>
   <option value="sistem informatika">sistem informatika</option>
   </select><br>
Prodi      : <select name="select">
          <option value="s1">s1</option>
   <option value="d3">d3</option>
   </select>
Hobi       : <input type="checkbox">masak  <input type="checkbox">lari
      <input type="checkbox">tidur  <input type="checkbox">makan
      <input type="checkbox">game  <input type="checkbox">lain-lain
Contact    : <select name="select">
          <option value="telephone">telephone</option>
   <option value="e-mail">e-mail</option>
   <option value="BBM">BBM</option>
   </select><br>

Leave Contact : <input type="text" name="textfield">

<input type="submit" name="submit" value="submit"> <input type="reset" name="submit2" value="cancel">
</form>

Contoh Membuat Hyper link:
<HTML>
<HEAD>
<TITLE>
Ulangkaji Pelajaran 4
</TITLE>
</HEAD>
<BODY BACKGROUND="sao.jpg">
<H1 ALIGN="center"><FONT COLOR="RED" FACE="ARIAL" SIZE="4">Manga Reader</H1>
<br>
<br>
<FONT COLOR="BLUE" FACE="ARIAL" SIZE="4">berbagai macem pilihan <b>sebagai berikut.</b></FONT>
<br>
<br>
<A HREF="LATIHAN1.HTML">latihan 1<H1 ALIGN="CENTER"> </H1> <IMG SRC="Laxus_vs_Mystogan.JPG."WIDTH=80 HEIGHT=80 BORDER=0></A>
<br>
<br>
<A HREF="LATIHAN2.HTML">latihan 2 <H1 ALIGN="CENTER"> </H1> <IMG SRC="Laxus_Mugshot.JPG" WIDTH=80 HEIGHT=80 BORDER=0></A>
<br>
<br>
<A HREF="LATIHAN3.HTML">latihan 3 <H1 ALIGN="CENTER"> </H1> <IMG SRC="Laxus_vs_Mystogan.JPG" WIDHT=45 HEIGHT=45 BORDER=0></A>
<br>
<A HREF="LATIHAN4.HTML">latihan 4 <H1 ALIGN="CENTER"> </H1> <IMG SRC="Sting_prop.png" WIDHT=80 HEIGHT=80 BORDER=0></A>
<br>
<br>

Nah sekian itu saja dari saya. barang kali mungkin agan ada yang mau menambahkan silahkan. Semoga bermanfaat Buat Agan Semua... (^_^)


0 komentar:

Posting Komentar