Senin, 12 Mei 2014

contoh html yang sudah siap pakai / dirunkan

<html xmlns=”http://www.w3.org/1999/xhtml&#8221; xml:lang=”en” lang=”en”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=iso-8859-1″ />
<meta name=”author” content=”beetlebum” />
<title>Sesi 2 – Link</title>
< link rel=”stylesheet” href=”style.css” />
h2  {
border-bottom: 1px dotted #dadada;
}
/* class */
.h2_bebas {
color: red;
}

/* id */
#h2_satu2nya {
color: green;
}
a {
color: green;
text-decoration: none;
}
a:hover {
text-decoration: underline;
font-weight: bold;
}
.warna_abu {
background-color: silver;
font-weight: bold;
}
</head>
<body>
<h2>Sesi 2 – Link / Anchor</h2>
<ul>
<li>
<a href=”01_Link.html” title=”Menuju ke Link”>Link / Anchor</a>
</li>
<li>
<a href=”03_Table.html” target=”_blank”>Table</a>
</li>
<li>
<a href=”02_Forms.html”>Form</a>
</li>
</ul>
<h2>H2 yang lain</h2>
<h2 id=”h2_satu2nya”>H2 yang lain lagi</h2>
<p>
the quick brown fox jump over the lazy dogs
</p>
</body>
</html>
Hasil Form :

  • —HTML Table script
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
<html xmlns=”http://www.w3.org/1999/xhtml&#8221; xml:lang=”en” lang=”en”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=iso-8859-1″ />
<meta name=”author” content=”beetlebum” />
<title>Sesi 2 – Table</title>
<link rel=”stylesheet” href=”style.css” />
</head>
<body>
<h2>Simple Table</h2>
<table border=”1″ cellpadding=”5″ cellspacing=”0″>
<tr>
<td>NRP</td>
<td>Nama</td>
<td>Alamat</td>
</tr>
<tr>
<td>6309001</td>
<td>Mahasiswa 1</td>
<td>Ujung Berung</td>
</tr>
<tr>
<td>6309001</td>
<td>Mahasiswa 2</td>
<td>Antapani</td>
</tr>
</table>
<h2>Medium Table</h2>
<table border=”1″ cellpadding=”5″ cellspacing=”0″>
<tr>
<td colspan=”3″>Biodata</td>
</tr>
<tr>
<td>NRP</td>
<td>:</td>
<td>6309001</td>
</tr>
<tr>
<td>Nama</td>
<td>:</td>
<td>Mahasiswa</td>
</tr>
<tr>
<td>Alamat</td>
<td>:</td>
<td>Ujung Berung</td>
</tr>
<tr>
<td colspan=”3″>Akun Website</td>
</tr>
<tr>
<td>Username</td>
<td>:</td>
<td>beetlebum</td>
</tr>
<tr>
<td>Password</td>
<td>:</td>
<td>**************</td>
</tr>
<tr>
<td colspan=”3″>Data Lain</td>
</tr>
<tr>
<td>a</td>
<td>b</td>
<td rowspan=”2″>c</td>
</tr>
<tr>
<td>d</td>
<td>e</td>
</tr>
</table>
</body>
</html>
Hasil Form :

  • HTML Forms
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;
<html xmlns=”http://www.w3.org/1999/xhtml&#8221; xml:lang=”en” lang=”en”>
<head>
<meta http-equiv=”content-type” content=”text/html; charset=iso-8859-1″ />
<meta name=”author” content=”beetlebum” />
<title>Sesi 2 – Form</title>
<link rel=”stylesheet” href=”style.css” />
<style>
@-moz-keyframes myfirst {
0%    {background:gold;}
25%    {background:orange;}
50%    {background:red;}
75%    {background:lawngreen;}
100% {background:blue;}
}
div{
width:auto;
height:auto;
-moz-animation:myfirst 5s linear 5s infinite alternate;
}
</style>
</head>
<body>
<div>
<h2>Form</h2>
<form name=”frmRegistrasi” method=”post” action=”file_yang_akan_memproses.php”>
NRP <br />
<input type=”text” name=”txtNrp” value=”” /> <br />
Nama <br />
<input type=”text” name=”txtNama” value=”” /> <br />
Password <br />
<input type=”password” name=”txtPassword” value=”” /> <br />
Jenis Kelamin <br />
<select name=”jk”>
<option value=”co”>Laki2</option>
<option value=”ce” selected=”selected”>Perempuan</option>
</select> <br />
<input type=”button” name=”btnBTN” value=”BUTTON” />
<input type=”submit” name=”btnSubmit” value=”SUBMIT” />
<input type=”reset” name=”btnReset” value=”RESET” />
</form>
</div>
</body>
</html>
Hasil Form :

 


     ditulis oleh : taufik asikin
Diposting oleh di

Tidak ada komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)