<html>
<head>
<script type="text/javascript">
function total(numberA,numberB)
{
return numberA + numberB
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(total(2,3))
</script>
<p>The script in the body section calls a function with two arguments, 2 and3.</p>
<p>The function returns the sum of these two arguments.</p>
</body>
</html>
<html>
<head>
<script type="text/javascript">
function myFunction()
{
return ("Hello, have a nice day!")
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(myFunction())
</script>
<p>The script in the body section calls a function.</p>
<p>The function returns a text.</p>
</body>
</html>
<head>
<script type="text/javascript">
function myFunction()
{
return ("Hello, have a nice day!")
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(myFunction())
</script>
<p>The script in the body section calls a function.</p>
<p>The function returns a text.</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<script type="text/javascript">
function myfunction(txt)
{
alert(txt)
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction('Good Morning!')"
value="In the Morning">
<input type="button"
onclick="myfunction('Good Evening!')"
value="In the Evening">
</form>
<p>
When you click on one of the buttons, a function will be called. The function
will alert
the argument that is passed to it.
</p>
</body>
</html>
<head>
<script type="text/javascript">
function myfunction(txt)
{
alert(txt)
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction('Good Morning!')"
value="In the Morning">
<input type="button"
onclick="myfunction('Good Evening!')"
value="In the Evening">
</form>
<p>
When you click on one of the buttons, a function will be called. The function
will alert
the argument that is passed to it.
</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<script type="text/javascript">
function myfunction(txt)
{
alert(txt)
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction('Hello')"
value="Call function">
</form>
<p>By pressing the button, a function with an argument will be called. The
function will alert
this argument.</p>
</body>
</html>
<head>
<script type="text/javascript">
function myfunction(txt)
{
alert(txt)
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction('Hello')"
value="Call function">
</form>
<p>By pressing the button, a function with an argument will be called. The
function will alert
this argument.</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<script type="text/javascript">
function myfunction()
{
alert("HELLO")
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
<p>By pressing the button, a function will be called. The function will alert a
message.</p>
</body>
</html>
<head>
<script type="text/javascript">
function myfunction()
{
alert("HELLO")
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
<p>By pressing the button, a function will be called. The function will alert a
message.</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<script type="text/javascript">
function myfunction()
{
alert("HELLO")
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
<p>By pressing the button, a function will be called. The function will alert a
message.</p>
</body>
</html>
<head>
<script type="text/javascript">
function myfunction()
{
alert("HELLO")
}
</script>
</head>
<body>
<form>
<input type="button"
onclick="myfunction()"
value="Call function">
</form>
<p>By pressing the button, a function will be called. The function will alert a
message.</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<script type="text/javascript">
var name = "Hege"
document.write(name)
document.write("<h1>"+name+"</h1>")
</script>
<p>This example declares a variable, assigns a value to it, and then displays
the variable.</p>
<p>Then the variable is displayed one more time, only this time as a
heading.</p>
</body>
</html>
<body>
<script type="text/javascript">
var name = "Hege"
document.write(name)
document.write("<h1>"+name+"</h1>")
</script>
<p>This example declares a variable, assigns a value to it, and then displays
the variable.</p>
<p>Then the variable is displayed one more time, only this time as a
heading.</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
</head>
<body>
<script type="text/javascript">
document.write("This message is written when the page loads")
</script>
</body>
</html>
<head>
</head>
<body>
<script type="text/javascript">
document.write("This message is written when the page loads")
</script>
</body>
</html>
Category:
0
komentar
<html>
<head>
<script type="text/javascript">
function message()
{
alert("This alert box was called with the onload event")
}
</script>
</head>
<body onload="message()">
</body>
</html>
<head>
<script type="text/javascript">
function message()
{
alert("This alert box was called with the onload event")
}
</script>
</head>
<body onload="message()">
</body>
</html>
Category:
0
komentar
<html>
<body>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
</body>
</html>
<body>
<script type="text/javascript">
document.write("<h1>Hello World!</h1>")
</script>
</body>
</html>
Category:
0
komentar
<html>
<body>
<script type="text/javascript">
document.write("Hello World!")
</script>
</body>
</html>
<body>
<script type="text/javascript">
document.write("Hello World!")
</script>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
a:link {color: #ff0000}
a.one:visited {color: #0000ff}
a.one:hover {color: #ffcc00}
a.two:visited {color: #0000ff}
a.two:hover {font-size: 150%}
a.three:visited {color: #0000ff}
a.three:hover {background: #66ff66}
a.four:visited {color: #0000ff}
a.four:hover {font-family: fixedsys}
a.five:visited {color: #0000ff; text-decoration: line-through}
a.five:hover {text-decoration: overline}
</style>
</head>
<body>
<p>Gerakkan pointer mouse di atas link-link di bawah ini untuk membuat link
tersebut berubah tampilannya.</p>
<p><a class="one" href="hlm1.htm"">Mengubah properti color</a></p>
<p><a class="two" href="hlm2.htm"> Mengubah properti font-size</a></p>
<p><a class="three" href="hlm3.htm"> Mengubah properti background-color</a></p>
<p><a class="four" href="hlm4.htm"> Mengubah properti font-family</a></p>
<p><a class="five" href="hlm5.htm"> Mengubah properti text-decoration</a></p>
</body>
</html>
<head>
<style type="text/css">
a:link {color: #ff0000}
a.one:visited {color: #0000ff}
a.one:hover {color: #ffcc00}
a.two:visited {color: #0000ff}
a.two:hover {font-size: 150%}
a.three:visited {color: #0000ff}
a.three:hover {background: #66ff66}
a.four:visited {color: #0000ff}
a.four:hover {font-family: fixedsys}
a.five:visited {color: #0000ff; text-decoration: line-through}
a.five:hover {text-decoration: overline}
</style>
</head>
<body>
<p>Gerakkan pointer mouse di atas link-link di bawah ini untuk membuat link
tersebut berubah tampilannya.</p>
<p><a class="one" href="hlm1.htm"">Mengubah properti color</a></p>
<p><a class="two" href="hlm2.htm"> Mengubah properti font-size</a></p>
<p><a class="three" href="hlm3.htm"> Mengubah properti background-color</a></p>
<p><a class="four" href="hlm4.htm"> Mengubah properti font-family</a></p>
<p><a class="five" href="hlm5.htm"> Mengubah properti text-decoration</a></p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
img.x1
{
position:absolute;
left:0;
top:0;
z-index:1
}
img.x2
{
position:absolute;
left:0;
top:100;
z-index:-1
}
</style>
</head>
<body>
<p><b>Catatan:</b> Netscape 4 tidak mendukung properti "z-index".</p>
<h1>Sepertinya Heading ini terhalang oleh gambar</h1>
<img class="x1" src="gambar.bmp" width="100" height="80">
<p>Nilai default z-index adalah 0. Z-index 1 memiliki prioritas lebih tinggi,
sedangkan Z-index –1 memiliki prioritas lebih rendah.</p>
<p></p>
<img class="x2" src="gambar.bmp" width="100" height="80">
<p>Sekarang Anda bisa membandingkan dengan tampilan di bagian bawah ini. Apakah
masih terhalang gambar?</p>
</body>
</html>
<head>
<style type="text/css">
img.x1
{
position:absolute;
left:0;
top:0;
z-index:1
}
img.x2
{
position:absolute;
left:0;
top:100;
z-index:-1
}
</style>
</head>
<body>
<p><b>Catatan:</b> Netscape 4 tidak mendukung properti "z-index".</p>
<h1>Sepertinya Heading ini terhalang oleh gambar</h1>
<img class="x1" src="gambar.bmp" width="100" height="80">
<p>Nilai default z-index adalah 0. Z-index 1 memiliki prioritas lebih tinggi,
sedangkan Z-index –1 memiliki prioritas lebih rendah.</p>
<p></p>
<img class="x2" src="gambar.bmp" width="100" height="80">
<p>Sekarang Anda bisa membandingkan dengan tampilan di bagian bawah ini. Apakah
masih terhalang gambar?</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
ul
{
list-style: square outside url("gambarkecil.gif")
}
</style>
</head>
<body>
<p>Disini Anda menggunakan gambar berukuran kecil sebagai bullet untuk list.
Properti outside akan menyebabkan list menjadi lebih rapi bila terdiri atas item
yang berupa kalimat panjang dan window browser berukuran kecil.</p>
<ul>
<li>Kopi</li>
<li>Teh</li>
<li>Coca Cola</li>
</ul>
</body>
</html>
<head>
<style type="text/css">
ul
{
list-style: square outside url("gambarkecil.gif")
}
</style>
</head>
<body>
<p>Disini Anda menggunakan gambar berukuran kecil sebagai bullet untuk list.
Properti outside akan menyebabkan list menjadi lebih rapi bila terdiri atas item
yang berupa kalimat panjang dan window browser berukuran kecil.</p>
<ul>
<li>Kopi</li>
<li>Teh</li>
<li>Coca Cola</li>
</ul>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
td {padding: 1.5cm}
td.value2 {padding: 0.5cm 2.5cm}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Ini adalah tabel dengan sel yang menggunakan padding sama pada setiap sisinya
(1,5cm).
</td>
</tr>
</table>
<br>
<table border="1">
<tr>
<td class="value2">
Bandingkan dengan tampilan tabel ini. Padding atas dan bawah memiliki nilai
0,5cm, sedangkan padding kanan dan kiri nilainya 2,5cm.
</td>
</tr>
</table>
</body>
</html>
<head>
<style type="text/css">
td {padding: 1.5cm}
td.value2 {padding: 0.5cm 2.5cm}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Ini adalah tabel dengan sel yang menggunakan padding sama pada setiap sisinya
(1,5cm).
</td>
</tr>
</table>
<br>
<table border="1">
<tr>
<td class="value2">
Bandingkan dengan tampilan tabel ini. Padding atas dan bawah memiliki nilai
0,5cm, sedangkan padding kanan dan kiri nilainya 2,5cm.
</td>
</tr>
</table>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
p.margin {margin: 2cm 4cm 3cm 80px}
</style>
</head>
<body>
<p>
Yang ini adalah paragraf biasa tanpa pengaturan margin, sepertinya biasa
saja.
</p>
<p class="margin">
Bandingkan dengan tampilan paragraf ini. Coba Anda kecilkan ukuran window
browser agar terlihat lebih jelas perbedaannya.
</p>
<p>
This is a paragraph
</p>
</body>
</html>
<head>
<style type="text/css">
p.margin {margin: 2cm 4cm 3cm 80px}
</style>
</head>
<body>
<p>
Yang ini adalah paragraf biasa tanpa pengaturan margin, sepertinya biasa
saja.
</p>
<p class="margin">
Bandingkan dengan tampilan paragraf ini. Coba Anda kecilkan ukuran window
browser agar terlihat lebih jelas perbedaannya.
</p>
<p>
This is a paragraph
</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
p.borderous
{
border-style: double;
border-width: 5px 10px 1px medium;
border-color: #ff0000
#00ff00 #0000ff
rgb(250,0,255)
}
</style>
</head>
<body>
<p class="borderous">
<b>Catatan:</b> Properti "border-color" dan "border-width" tidak dikenali oleh
browser Internet Explorer bila digunakan secara langsung. Gunakan properti
"border-style" untuk menyiapkan border dalam Internet Explorer.<br>
Internet Explorer 5.5 mendukung semua border style. Internet Explorer 4.0 - 5.0
tidak mendukung nilai "dotted" dan "dashed" </p>
</body>
</html>
<head>
<style type="text/css">
p.borderous
{
border-style: double;
border-width: 5px 10px 1px medium;
border-color: #ff0000
#00ff00 #0000ff
rgb(250,0,255)
}
</style>
</head>
<body>
<p class="borderous">
<b>Catatan:</b> Properti "border-color" dan "border-width" tidak dikenali oleh
browser Internet Explorer bila digunakan secara langsung. Gunakan properti
"border-style" untuk menyiapkan border dalam Internet Explorer.<br>
Internet Explorer 5.5 mendukung semua border style. Internet Explorer 4.0 - 5.0
tidak mendukung nilai "dotted" dan "dashed" </p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
p.normal {font-weight: normal}
p.tebal {font-weight: bold}
p.teballl {font-weight: 900}
p.lengkap
{
font: italic small-caps 900 12px arial
}
</style>
</head>
<body>
<p class="normal">
Perhatikan paragraf ini</p>
<p class="tebal">
Bandingkan dengan paragraf diatasnya</p>
<p class="teballl">
Bandingkan yang ini juga</p>
<p class="lengkap">
Paragraf dengan semua atribut font dimasukkan</p>
</body>
</html>
<head>
<style type="text/css">
p.normal {font-weight: normal}
p.tebal {font-weight: bold}
p.teballl {font-weight: 900}
p.lengkap
{
font: italic small-caps 900 12px arial
}
</style>
</head>
<body>
<p class="normal">
Perhatikan paragraf ini</p>
<p class="tebal">
Bandingkan dengan paragraf diatasnya</p>
<p class="teballl">
Bandingkan yang ini juga</p>
<p class="lengkap">
Paragraf dengan semua atribut font dimasukkan</p>
</body>
</html>
Category:
0
komentar
<html>
<head>
<style type="text/css">
body
{
background: #00ff00
url("gambar.gif")
no-repeat fixed
center center
}
</style>
</head>
<body>
<p>
<b>Catatan:</b>
Properti background-attachment dan background-position tidak bisa digunakan
dalam browser Netscape 4.0.
</p>
<p>Ada teks disini</p>
<p>Tuliskan sekehendak kalian</p>
<p>Terserah apa saja</p>
<p>Yang penting ada tulisannya</p>
</body>
</html>
<head>
<style type="text/css">
body
{
background: #00ff00
url("gambar.gif")
no-repeat fixed
center center
}
</style>
</head>
<body>
<p>
<b>Catatan:</b>
Properti background-attachment dan background-position tidak bisa digunakan
dalam browser Netscape 4.0.
</p>
<p>Ada teks disini</p>
<p>Tuliskan sekehendak kalian</p>
<p>Terserah apa saja</p>
<p>Yang penting ada tulisannya</p>
</body>
</html>
Category:
0
komentar
<html>
<body bgcolor="#ffffff" text="yellow">
<p>
Paragraf ini terlihat tidak nyaman dibaca karena menggunakan kombinasi warna
latar belakang dan warna teks yang tidak sesuai.
</p>
</body>
</html>
<body bgcolor="#ffffff" text="yellow">
<p>
Paragraf ini terlihat tidak nyaman dibaca karena menggunakan kombinasi warna
latar belakang dan warna teks yang tidak sesuai.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body bgcolor="#d0d0d0">
<p>
Paragraf ini terlihat enak dibaca karena menggunakan kombinasi warna latar
belakang dan warna teks yang sesuai.
</p>
</body>
</html>
<body bgcolor="#d0d0d0">
<p>
Paragraf ini terlihat enak dibaca karena menggunakan kombinasi warna latar
belakang dan warna teks yang sesuai.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
Anda dapat menggunakan gambar sebagai suatu link:
<a href="halaman2.htm" >
<img border="0" src="gambar1.gif" width="65" height="38">
</a>
</p>
<p>
Gerakkan pointer mouse di atas gambar untuk melihat perbedaan link yang dituju:
</p>
<img src="../images/planet.gif" width=145 height=126 usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm" >
<area shape="circle" coords="90,58,3" alt="Mercur" href="mercur.htm" >
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm" >
</map>
</body>
</html>
<body>
<p>
Anda dapat menggunakan gambar sebagai suatu link:
<a href="halaman2.htm" >
<img border="0" src="gambar1.gif" width="65" height="38">
</a>
</p>
<p>
Gerakkan pointer mouse di atas gambar untuk melihat perbedaan link yang dituju:
</p>
<img src="../images/planet.gif" width=145 height=126 usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm" >
<area shape="circle" coords="90,58,3" alt="Mercur" href="mercur.htm" >
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm" >
</map>
</body>
</html>
Category:
0
komentar
<html>
<body>
<img src="ss.jpg" alt="Keterangan" width="50" height="350">
<p>
Browser text-only hanya akan menampilkan teks dalam atribut "alt", yaitu
Keterangan".
Perhatikan bahwa bilamana Anda membawa pointer mouse di atas gambar tersebut
maka teks alternatif akan ditampilkan.
</p>
</body>
</html>
<body>
<img src="ss.jpg" alt="Keterangan" width="50" height="350">
<p>
Browser text-only hanya akan menampilkan teks dalam atribut "alt", yaitu
Keterangan".
Perhatikan bahwa bilamana Anda membawa pointer mouse di atas gambar tersebut
maka teks alternatif akan ditampilkan.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" align="bottom" width="100" height="50">
di antara teks
</p>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" align="middle" width="100" height="50">
di antara teks
</p>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" align="top" width="100" height="50">
di antara teks
</p>
<p>Perhatikan bahwa default pengaturan adalah bottom (diletakkan di bagian
bawah)</p>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" width="100" height="50">
di antara teks
</p>
<p>
<img src ="../images/contoh.gif" width="100" height="50">
Sebuah gambar di depan teks
</p>
<p>
Sebuah gambar di belakang teks
<img src ="../images/contoh.gif" width="100" height="50">
</p>
</body>
</html>
<body>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" align="bottom" width="100" height="50">
di antara teks
</p>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" align="middle" width="100" height="50">
di antara teks
</p>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" align="top" width="100" height="50">
di antara teks
</p>
<p>Perhatikan bahwa default pengaturan adalah bottom (diletakkan di bagian
bawah)</p>
<p>
Sebuah gambar
<img src ="../images/contoh.gif" width="100" height="50">
di antara teks
</p>
<p>
<img src ="../images/contoh.gif" width="100" height="50">
Sebuah gambar di depan teks
</p>
<p>
Sebuah gambar di belakang teks
<img src ="../images/contoh.gif" width="100" height="50">
</p>
</body>
</html>
Category:
0
komentar
<html>
<body background="background.jpg">
<h3>Lihatlah, ada gambar latar belakang!</h3>
<p>Baik file gambar dengan format gif maupun jpg dapat digunakan sebagai latar
belakang HTML.</p>
<p>Bila gambar yang digunakan lebih kecil dari halaman situs, gambar akan
ditampilkan berulang-ulang.</p>
<p>
Sebuah gambar dari folder lokal:
<img src="gambar1.gif" width="144" height="50">
</p>
<p>
Gambar dari folder lain:
<img src="../images/gambar2.gif" width="33" height="32">
</p>
<p>
Mengambil gambar dari situs lain:
<img src="www.yahoo.com/images/ie.gif" width="73" height="68">
</p>
</body>
</html>
<body background="background.jpg">
<h3>Lihatlah, ada gambar latar belakang!</h3>
<p>Baik file gambar dengan format gif maupun jpg dapat digunakan sebagai latar
belakang HTML.</p>
<p>Bila gambar yang digunakan lebih kecil dari halaman situs, gambar akan
ditampilkan berulang-ulang.</p>
<p>
Sebuah gambar dari folder lokal:
<img src="gambar1.gif" width="144" height="50">
</p>
<p>
Gambar dari folder lain:
<img src="../images/gambar2.gif" width="33" height="32">
</p>
<p>
Mengambil gambar dari situs lain:
<img src="www.yahoo.com/images/ie.gif" width="73" height="68">
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<form action="@" method="post" enctype="text/plain">
<h3>Form ini mengirim sebuah e-mail ke W3C.</h3>
Nama<br>
<input type="text" name="nama" value="Nama Anda” size="20">
<br>
Mail:<br>
<input type="text" name="mail" value="Mail Anda" size="20">
<br>
Komentar:<br>
<input type="text" name="komentar" value="Komentar Anda" size="40">
<br><br>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
</body>
</html>
<body>
<form action="@" method="post" enctype="text/plain">
<h3>Form ini mengirim sebuah e-mail ke W3C.</h3>
Nama<br>
<input type="text" name="nama" value="Nama Anda” size="20">
<br>
Mail:<br>
<input type="text" name="mail" value="Mail Anda" size="20">
<br>
Komentar:<br>
<input type="text" name="komentar" value="Komentar Anda" size="40">
<br><br>
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>
</body>
</html>
Category:
0
komentar
<html>
<body>
<form name="input" action="http://www.w3c.org/form_action.asp" method="get">
Masukkan nama depan Anda:
<input type="text" name="namadepan" value="Mickey">
<br>Masukkan nama belakang Anda:
<input type="text" name="namabelakang" value="Mouse">
<br>
<input type="submit" value="Submit">
</form>
<p>
Bila Anda meng-klik tombol "Submit", Anda akan mengirim input yang dimasukkan
lewat form di atas ke pemroses yang bernama form_action.asp di situs w3c.
</p>
</body>
</html>
<body>
<form name="input" action="http://www.w3c.org/form_action.asp" method="get">
Masukkan nama depan Anda:
<input type="text" name="namadepan" value="Mickey">
<br>Masukkan nama belakang Anda:
<input type="text" name="namabelakang" value="Mouse">
<br>
<input type="submit" value="Submit">
</form>
<p>
Bila Anda meng-klik tombol "Submit", Anda akan mengirim input yang dimasukkan
lewat form di atas ke pemroses yang bernama form_action.asp di situs w3c.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<fieldset>
<legend>
Informasi kesehatan:
</legend>
<form>
Tinggi <input type="text" size="3">
Berat <input type="text" size="3">
<br>
<input type="button" value="Ada tombol disini">
</form>
</fieldset>
<p>
Bila tidak terlihat adanya border di sekeliling form input, browser Anda sudah
terlalu lama.
</p>
</body>
</html>
<body>
<fieldset>
<legend>
Informasi kesehatan:
</legend>
<form>
Tinggi <input type="text" size="3">
Berat <input type="text" size="3">
<br>
<input type="button" value="Ada tombol disini">
</form>
</fieldset>
<p>
Bila tidak terlihat adanya border di sekeliling form input, browser Anda sudah
terlalu lama.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<form>
<select name="mobil">
<option value="volvo">Volvo
<option value="peugeot">Peugeot
<option value="fiat" selected>Fiat
<option value="jaguar">Jaguar
</select>
</form>
</body>
</html>
<body>
<form>
<select name="mobil">
<option value="volvo">Volvo
<option value="peugeot">Peugeot
<option value="fiat" selected>Fiat
<option value="jaguar">Jaguar
</select>
</form>
</body>
</html>
Category:
0
komentar
<html>
<body>
<form>
Saya memiliki sebuah sepeda:
<input type="checkbox" name="Sepeda">
<br>
Saya memiliki sebuah mobil:
<input type="checkbox" name="Mobil" value="ON">
<br>
Jenis kelamin Anda?
<br>
Pria:
<input type="radio" name="Sex" value="pria">
<br>
Wanita:
<input type="radio" name="Sex" value="wanita" checked>
</form>
<p>
Ketika seorang pengguna memberikan klik mouse pada sebuah tombol radio, tombol
tersebut terlihat diberi tanda cek, dan semua tombol lain yang berada dalam nama
yang sama akan kehilangan tanda cek-nya
</p>
</body>
</html>
<body>
<form>
Saya memiliki sebuah sepeda:
<input type="checkbox" name="Sepeda">
<br>
Saya memiliki sebuah mobil:
<input type="checkbox" name="Mobil" value="ON">
<br>
Jenis kelamin Anda?
<br>
Pria:
<input type="radio" name="Sex" value="pria">
<br>
Wanita:
<input type="radio" name="Sex" value="wanita" checked>
</form>
<p>
Ketika seorang pengguna memberikan klik mouse pada sebuah tombol radio, tombol
tersebut terlihat diberi tanda cek, dan semua tombol lain yang berada dalam nama
yang sama akan kehilangan tanda cek-nya
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<form>
Nama depan:
<input type="text" name="namadepan">
<br>
Nama belakang:
<input type="text" name="namabelakang">
<br>
Password:
<input type="password" name="password">
</form>
<p>
Perhatikan bahwa ketika Anda mengetikkan karakter-karakter dalam suatu field
password, browser akan menampilkan asterisk atau bullet saja, bukannya karakter
yang diketikkan.
</p>
</body>
</html>
<body>
<form>
Nama depan:
<input type="text" name="namadepan">
<br>
Nama belakang:
<input type="text" name="namabelakang">
<br>
Password:
<input type="password" name="password">
</form>
<p>
Perhatikan bahwa ketika Anda mengetikkan karakter-karakter dalam suatu field
password, browser akan menampilkan asterisk atau bullet saja, bukannya karakter
yang diketikkan.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<h4>Sel yang melebar dua kolom:</h4>
<table border="1">
<tr>
<th>Nama</th>
<th colspan="2">Telepon</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>Sel yang melebar dua baris:</h4>
<table border="1">
<tr>
<th>Nama depan:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telepon:</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
<body>
<h4>Sel yang melebar dua kolom:</h4>
<table border="1">
<tr>
<th>Nama</th>
<th colspan="2">Telepon</th>
</tr>
<tr>
<td>Bill Gates</td>
<td>555 77 854</td>
<td>555 77 855</td>
</tr>
</table>
<h4>Sel yang melebar dua baris:</h4>
<table border="1">
<tr>
<th>Nama depan:</th>
<td>Bill Gates</td>
</tr>
<tr>
<th rowspan="2">Telepon:</th>
<td>555 77 854</td>
</tr>
<tr>
<td>555 77 855</td>
</tr>
</table>
</body>
</html>
Category:
0
komentar
<html>
<body>
<table border="1">
<tr>
<td>Teks</td>
<td>Teks</td>
</tr>
<tr>
<td></td>
<td>Teks</td>
</tr>
</table>
<p>
Seperti yang Anda lihat, salah satu sel tidak memiliki border. Itu terjadi
karena sel tersebut kosong. Cobalah untuk menyisipkan sebuah spasi ke dalam sel
tersebut. Ternyata tetap saja tidak memiliki border.
</p>
<p>
Cara yang benar adalah dengan menyisipkan spasi non-breaking di dalam sel.
</p>
<p>Spasi non-breaking adalah sebuah entitas karakter. Bila Anda tidak mengetahui
apa yang disebut karakter entitas, baca kembali materi kuliah tentang hal
tersebut.
</p>
<p>Entitas spasi non-breaking dimulai dengan tanda ampersand ("&"),
kemudian karakter-karakter "nbsp", dan diakhiri dengan semicolon (";")
</p>
<p>
</p>
</body>
</html>
<body>
<table border="1">
<tr>
<td>Teks</td>
<td>Teks</td>
</tr>
<tr>
<td></td>
<td>Teks</td>
</tr>
</table>
<p>
Seperti yang Anda lihat, salah satu sel tidak memiliki border. Itu terjadi
karena sel tersebut kosong. Cobalah untuk menyisipkan sebuah spasi ke dalam sel
tersebut. Ternyata tetap saja tidak memiliki border.
</p>
<p>
Cara yang benar adalah dengan menyisipkan spasi non-breaking di dalam sel.
</p>
<p>Spasi non-breaking adalah sebuah entitas karakter. Bila Anda tidak mengetahui
apa yang disebut karakter entitas, baca kembali materi kuliah tentang hal
tersebut.
</p>
<p>Entitas spasi non-breaking dimulai dengan tanda ampersand ("&"),
kemudian karakter-karakter "nbsp", dan diakhiri dengan semicolon (";")
</p>
<p>
</p>
</body>
</html>
Category:
2
komentar
<html>
<body>
<h4>Dengan warna latar belakang:</h4>
<table border="1" bgcolor="red">
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan latar belakang gambar:</h4>
<table border="1" background="../bg.jpg">
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Latar belakang pada sel:</h4>
<table border="1">
<tr>
<td bgcolor="red">Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td background="../bg.jpg">
Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
<body>
<h4>Dengan warna latar belakang:</h4>
<table border="1" bgcolor="red">
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Dengan latar belakang gambar:</h4>
<table border="1" background="../bg.jpg">
<tr>
<td>Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td>Kedua</td>
<td>Baris</td>
</tr>
</table>
<h4>Latar belakang pada sel:</h4>
<table border="1">
<tr>
<td bgcolor="red">Pertama</td>
<td>Baris</td>
</tr>
<tr>
<td background="../bg.jpg">
Kedua</td>
<td>Baris</td>
</tr>
</table>
</body>
</html>
Category:
0
komentar
Membuat tabel
<html>
<body>
<p>
Setiap tabel dimulai dengan tag table.
Setiap baris tabel dimulai dengan tag tr.
Setiap data dalam tabel dimulai dengan tag td.
</p>
<h4>Satu baris satu kolom dengan border normal:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>Satu baris dan tiga kolom dengan border tebal:</h4>
<table border="8">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
</table>
<h4>Dua baris dan tiga kolom dengan border sangat tebal:</h4>
<table border="15">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
<h4>Tabel ini tidak memiliki border:</h4>
<table border="0">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
</body>
</html>
<html>
<body>
<p>
Setiap tabel dimulai dengan tag table.
Setiap baris tabel dimulai dengan tag tr.
Setiap data dalam tabel dimulai dengan tag td.
</p>
<h4>Satu baris satu kolom dengan border normal:</h4>
<table border="1">
<tr>
<td>100</td>
</tr>
</table>
<h4>Satu baris dan tiga kolom dengan border tebal:</h4>
<table border="8">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
</table>
<h4>Dua baris dan tiga kolom dengan border sangat tebal:</h4>
<table border="15">
<tr>
<td>100</td>
<td>200</td>
<td>300</td>
</tr>
<tr>
<td>400</td>
<td>500</td>
<td>600</td>
</tr>
</table>
<h4>Tabel ini tidak memiliki border:</h4>
<table border="0">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
Ini adalah link ke e-mail:
<a href="mailto:saya@microsoft.com?Subject=Halo%20lagi">
Kirim e-mail</a>
</p>
<p>
<b>Catatan:</b> Spasi di antara setiap kata sebaiknya digantikan dengan tanda
%20 untuk <b>memastikan</b> bahwa browser akan menampilkan teks Anda dengan
benar.
</p>
<p>
Ini juga contoh link ke e-mail:
<a href="mailto:anda@microsoft.com?
cc=dia@microsoft.com&bcc=kamu@microsoft.com&subject=Summer%20Party&body=Apakah
%20Anda%20mau%20diundang%20ke%20pesta%20malam%20minggu?">Kirim e-mail!</a>
</p>
</body>
</html>
<body>
<p>
Ini adalah link ke e-mail:
<a href="mailto:saya@microsoft.com?Subject=Halo%20lagi">
Kirim e-mail</a>
</p>
<p>
<b>Catatan:</b> Spasi di antara setiap kata sebaiknya digantikan dengan tanda
%20 untuk <b>memastikan</b> bahwa browser akan menampilkan teks Anda dengan
benar.
</p>
<p>
Ini juga contoh link ke e-mail:
<a href="mailto:anda@microsoft.com?
cc=dia@microsoft.com&bcc=kamu@microsoft.com&subject=Summer%20Party&body=Apakah
%20Anda%20mau%20diundang%20ke%20pesta%20malam%20minggu?">Kirim e-mail!</a>
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
<a href="halaman.htm">
Teks ini</a> adalah sebuah link ke suatu halaman
dalam situs Web.
</p>
<p>
<a href="www.microsoft.com">
Teks ini</a> adalah sebuah link ke halaman awal
Situs Microsoft di World Wide Web.
</p>
<p>
<a href="#C4">
Melompat ke bagian lain dalam halaman ini.
</a>
</p>
<p>
Anda dapat juga menggunakan gambar sebagai sebuah link:
<a href="linkgambar.htm">
<img border="0" src="tombol.gif" width="65" height="38">
</a>
</p>
<a href="baru.htm" target="_blank">halaman Berikutnya</a>
<p>
Bila Anda memberikan atribut target sebuah link menjadi "_blank",
Link tersebut akan membuka sebuah window browser baru.
</p>
<p>
<p> Ada tulisan disini (lakukan copy dan paste baris ini untuk baris berikutnya)
</p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<a name="C4"><h2> Disinilah tujuan lompatan link internal anda </h2></a>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
</body>
</html>
<body>
<p>
<a href="halaman.htm">
Teks ini</a> adalah sebuah link ke suatu halaman
dalam situs Web.
</p>
<p>
<a href="www.microsoft.com">
Teks ini</a> adalah sebuah link ke halaman awal
Situs Microsoft di World Wide Web.
</p>
<p>
<a href="#C4">
Melompat ke bagian lain dalam halaman ini.
</a>
</p>
<p>
Anda dapat juga menggunakan gambar sebagai sebuah link:
<a href="linkgambar.htm">
<img border="0" src="tombol.gif" width="65" height="38">
</a>
</p>
<a href="baru.htm" target="_blank">halaman Berikutnya</a>
<p>
Bila Anda memberikan atribut target sebuah link menjadi "_blank",
Link tersebut akan membuka sebuah window browser baru.
</p>
<p>
<p> Ada tulisan disini (lakukan copy dan paste baris ini untuk baris berikutnya)
</p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<a name="C4"><h2> Disinilah tujuan lompatan link internal anda </h2></a>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
<p> Ada tulisan disini </p>
</body>
</html>
Category:
0
komentar
<html>
<frameset rows="50%,50%">
<frame noresize="true" src="frame1.htm">
<frameset cols="25%,75%">
<frame noresize="true" src="frame2.htm">
<frame noresize="true" src="frame3.htm">
</frameset>
</frameset>
</html>
<frameset rows="50%,50%">
<frame noresize="true" src="frame1.htm">
<frameset cols="25%,75%">
<frame noresize="true" src="frame2.htm">
<frame noresize="true" src="frame3.htm">
</frameset>
</frameset>
</html>
Category:
0
komentar
<html>
<frameset rows="50%,50%">
<frame src="frame1.htm">
<frameset cols="25%,75%">
<frame src="frame2.htm">
<frame src="frame3.htm">
</frameset>
</frameset>
</html>
<frameset rows="50%,50%">
<frame src="frame1.htm">
<frameset cols="25%,75%">
<frame src="frame2.htm">
<frame src="frame3.htm">
</frameset>
</frameset>
</html>
Category:
0
komentar
<html>
<body>
<iframe src ="default.htm">
</iframe>
<p>Beberapa browser lama tidak mendukung iframe.</p>
<p>Bila browser yang Anda pakai sekarang tidak mendukung, iframe tak akan
terlihat.</p>
</body>
</html>
<body>
<iframe src ="default.htm">
</iframe>
<p>Beberapa browser lama tidak mendukung iframe.</p>
<p>Bila browser yang Anda pakai sekarang tidak mendukung, iframe tak akan
terlihat.</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
satu dosin adalah
<del>duapuluh</del>
<ins>duabelas</ins>
buah
</p>
<p>
Hampir semua browser akan memberi garis (overstrike) pada teks yang (maksudnya)
terhapus dan teks yang disisipkan akan diberi garis bawah.
</p>
<p>
Tetapi beberapa browser yang lama akan menampilkan teks yang terhapus atau teks
disisipkan sebagai suatu teks biasa (plain text).
</p>
<p>Ini adalah entitas karakter: �</p>
<p>
Coba untuk mengganti 000 dengan suatu angka (misalnya 169), dan muat ulang
halaman Anda agar Anda dapat melihat hasil dari perubahan yang dilakukan.
</p>
</body>
</html>
<body>
<p>
satu dosin adalah
<del>duapuluh</del>
<ins>duabelas</ins>
buah
</p>
<p>
Hampir semua browser akan memberi garis (overstrike) pada teks yang (maksudnya)
terhapus dan teks yang disisipkan akan diberi garis bawah.
</p>
<p>
Tetapi beberapa browser yang lama akan menampilkan teks yang terhapus atau teks
disisipkan sebagai suatu teks biasa (plain text).
</p>
<p>Ini adalah entitas karakter: �</p>
<p>
Coba untuk mengganti 000 dengan suatu angka (misalnya 169), dan muat ulang
halaman Anda agar Anda dapat melihat hasil dari perubahan yang dilakukan.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<code>Kode Komputer </code>
<br>
<kbd>Masukan dari keyboard</kbd>
<br>
<tt>Teks jenis teletype </tt>
<br>
<samp>Teks contoh</samp>
<br>
<var>Variabel komputer </var>
<br>
<p>
<b>Catatan:</b> Tag-tag tersebut biasanya digunakan untuk menampilkan kode
komputer/ pemrograman.
<p>
<address>
FIK UMI<br>
Jl. Urip Sumoharjo<br>
KM. 4<br>
Makassar
</address>
<br>
<abbr title="Universitas Muslim Indonesia">UMI</abbr>
<br>
<acronym title="World Wide Web">WWW</acronym>
<p>Atribut title digunakan untuk menampilkan versi yang dieja ketika pointer
mouse berada di atas kependekan atau singkatan.</p>
<p>Dalam IE 5, hanya elemen acronym yang mau bekerja.</p>
<p>Dalam Navigator 6.2, elemen abbr dan acronym keduanya dapat bekerja.</p>
</body>
</html>
<body>
<code>Kode Komputer </code>
<br>
<kbd>Masukan dari keyboard</kbd>
<br>
<tt>Teks jenis teletype </tt>
<br>
<samp>Teks contoh</samp>
<br>
<var>Variabel komputer </var>
<br>
<p>
<b>Catatan:</b> Tag-tag tersebut biasanya digunakan untuk menampilkan kode
komputer/ pemrograman.
<p>
<address>
FIK UMI<br>
Jl. Urip Sumoharjo<br>
KM. 4<br>
Makassar
</address>
<br>
<abbr title="Universitas Muslim Indonesia">UMI</abbr>
<br>
<acronym title="World Wide Web">WWW</acronym>
<p>Atribut title digunakan untuk menampilkan versi yang dieja ketika pointer
mouse berada di atas kependekan atau singkatan.</p>
<p>Dalam IE 5, hanya elemen acronym yang mau bekerja.</p>
<p>Dalam Navigator 6.2, elemen abbr dan acronym keduanya dapat bekerja.</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<b>Teks ini tebal </b>
<br>
<strong> Teks ini juga tebal </strong>
<br>
<big> Teks ini hurufnya besar </big>
<br>
<em> Teks ini miring </em>
<br>
<i> Teks ini juga miring </i>
<br>
<small> Teks ini hurufnya kecil </small>
<br>
Teks ini berisi <sub> subscript </sub>
<br>
Teks ini berisi <sup> superscript </sup>
</body>
</html>
<body>
<b>Teks ini tebal </b>
<br>
<strong> Teks ini juga tebal </strong>
<br>
<big> Teks ini hurufnya besar </big>
<br>
<em> Teks ini miring </em>
<br>
<i> Teks ini juga miring </i>
<br>
<small> Teks ini hurufnya kecil </small>
<br>
Teks ini berisi <sub> subscript </sub>
<br>
Teks ini berisi <sup> superscript </sup>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
Paragraf ini mengandung banyak spasi dan baris dalam kode sumbernya, tetapi
browser akan mengabaikannya.
</p>
<p>
Sedangkan yang ini memiliki spasi panjang.
</p>
<p align=”center”>
Jumlah baris dalam setiap paragraf tergantung pada ukuran window browser Anda.
Bila Anda mengubah ukuran window browser, jumlah baris dalam paragraf akan
berubah.
</p>
<p align=”right”>
Untuk memotong <br>baris<br>dalam sebuah<br>paragraf,<br>gunakan tag br.
</p>
</body>
</html>
<body>
<p>
Paragraf ini mengandung banyak spasi dan baris dalam kode sumbernya, tetapi
browser akan mengabaikannya.
</p>
<p>
Sedangkan yang ini memiliki spasi panjang.
</p>
<p align=”center”>
Jumlah baris dalam setiap paragraf tergantung pada ukuran window browser Anda.
Bila Anda mengubah ukuran window browser, jumlah baris dalam paragraf akan
berubah.
</p>
<p align=”right”>
Untuk memotong <br>baris<br>dalam sebuah<br>paragraf,<br>gunakan tag br.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<h4>Sebentuk list unordered:</h4>
<ul>
<li>Kopi</li>
<li>Teh</li>
<li>Susu</li>
</ul>
<br>
<h4>Sebentuk list ordered:</h4>
<ol>
<li>Kopi</li>
<li>Teh</li>
<li>Susu</li>
</ol>
</body>
</html>
<body>
<h4>Sebentuk list unordered:</h4>
<ul>
<li>Kopi</li>
<li>Teh</li>
<li>Susu</li>
</ul>
<br>
<h4>Sebentuk list ordered:</h4>
<ol>
<li>Kopi</li>
<li>Teh</li>
<li>Susu</li>
</ol>
</body>
</html>
Category:
0
komentar
<html>
<body>
<h4>Sebuah list bersarang:</h4>
<ul>
<li>Kopi</li>
<li>Teh
<ul>
<li>Teh hitam</li>
<li>Teh Hijau</li>
</ul>
</li>
<li>Susu</li>
</ul>
<br>
<h4>Contoh list definisi:</h4>
<dl>
<dt>Kopi</dt>
<dd>Minuman panas hitam</dd>
<dt>Susu</dt>
<dd>Minuman dingin putih</dd>
</dl>
</body>
</html>
<body>
<h4>Sebuah list bersarang:</h4>
<ul>
<li>Kopi</li>
<li>Teh
<ul>
<li>Teh hitam</li>
<li>Teh Hijau</li>
</ul>
</li>
<li>Susu</li>
</ul>
<br>
<h4>Contoh list definisi:</h4>
<dl>
<dt>Kopi</dt>
<dd>Minuman panas hitam</dd>
<dt>Susu</dt>
<dd>Minuman dingin putih</dd>
</dl>
</body>
</html>
Category:
0
komentar
<html>
<body>
<h4>List dengan bullet berbentuk disc:</h4>
<ul type="disc">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ul>
<h4>List dengan bullet berbentuk lingkaran:</h4>
<ul type="circle">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ul>
<h4>List dengan bullet berbentuk kotak:</h4>
<ul type="square">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ul>
</body>
</html>
<body>
<h4>List dengan bullet berbentuk disc:</h4>
<ul type="disc">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ul>
<h4>List dengan bullet berbentuk lingkaran:</h4>
<ul type="circle">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ul>
<h4>List dengan bullet berbentuk kotak:</h4>
<ul type="square">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ul>
</body>
</html>
Category:
1 komentar
<html>
<body>
<h4>List bernomor:</h4>
<ol>
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan huruf:</h4>
<ol type="A">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan huruf kecil:</h4>
<ol type="a">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan angka romawi:</h4>
<ol type="I">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan angka romawi kecil:</h4>
<ol type="i">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
</body>
</html>
<body>
<h4>List bernomor:</h4>
<ol>
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan huruf:</h4>
<ol type="A">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan huruf kecil:</h4>
<ol type="a">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan angka romawi:</h4>
<ol type="I">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
<h4>List dengan angka romawi kecil:</h4>
<ol type="i">
<li>Apel</li>
<li>Pisang</li>
<li>Lemon</li>
<li>Jeruk</li>
</ol>
</body>
</html>
Category:
1 komentar
<html>
<body>
<p>Tag hr mendefinisikan sebuah garis horisontal, default-nya adalah rata
tengah:</p>
<hr color=”green” >
<p align=”left”>Terdapat paragraf disini</p>
<hr width=”80%” size=”10” align=”left”>
<p align=”right”>Terdapat paragraf disini</p>
<hr width=”400” size=”6” align=”right” color=”red”>
<center>
<p>Terdapat paragraf disini</p>
</center>
<!— Ini adalah komentar yang tidak akan ditampilkan di layar browser -->
</body>
</html>
<body>
<p>Tag hr mendefinisikan sebuah garis horisontal, default-nya adalah rata
tengah:</p>
<hr color=”green” >
<p align=”left”>Terdapat paragraf disini</p>
<hr width=”80%” size=”10” align=”left”>
<p align=”right”>Terdapat paragraf disini</p>
<hr width=”400” size=”6” align=”right” color=”red”>
<center>
<p>Terdapat paragraf disini</p>
</center>
<!— Ini adalah komentar yang tidak akan ditampilkan di layar browser -->
</body>
</html>
Category:
0
komentar
<html>
<body>
<body bgcolor="yellow">
<p>
Perhatikan bahwa halaman ini seharusnya berwarna kuning.
</p>
<h1>Ini adalah heading 1</h1>
<h2>Ini adalah heading 2</h2>
<h3>Ini adalah heading 3</h3>
<h4>Ini adalah heading 4</h4>
<h5>Ini adalah heading 5</h5>
<h6>Ini adalah heading 6</h6>
<p>Gunakan tag heading hanya untuk membuat heading saja. Jangan
menggunakan tag tersebut hanya untuk membuat tampilan huruf tebal.
Gunakan tag lain untuk keperluan itu. </p>
<h1 align="center">Ini adalah heading 1</h1>
<p>Heading di atas telah diposisikan untuk berada di tengah halaman ini.
</p>
</body>
</html>
<body>
<body bgcolor="yellow">
<p>
Perhatikan bahwa halaman ini seharusnya berwarna kuning.
</p>
<h1>Ini adalah heading 1</h1>
<h2>Ini adalah heading 2</h2>
<h3>Ini adalah heading 3</h3>
<h4>Ini adalah heading 4</h4>
<h5>Ini adalah heading 5</h5>
<h6>Ini adalah heading 6</h6>
<p>Gunakan tag heading hanya untuk membuat heading saja. Jangan
menggunakan tag tersebut hanya untuk membuat tampilan huruf tebal.
Gunakan tag lain untuk keperluan itu. </p>
<h1 align="center">Ini adalah heading 1</h1>
<p>Heading di atas telah diposisikan untuk berada di tengah halaman ini.
</p>
</body>
</html>
Category:
0
komentar
<html>
<body>
<p>
Bila browser Anda mendukung kemampuan bi-directional override (bdo), baris
berikut ini akan dituliskan dari kanan ke kiri (rtl):
</p>
<bdo dir="rtl">
Anggap saja ini tulisan bahasa Arab
</bdo>
<br>
Ini adalah contoh quotation panjang:
<blockquote>
Ini adalah quotation panjang. Ini adalah quotation panjang. Ini adalah quotation
panjang. Ini adalah quotation panjang. Ini adalah quotation panjang.
</blockquote>
Ini adalah contoh quotation pendek:
<q>
Ini adalah quotation pendek.
</q>
<p>
Menggunakan elemen blockquote, browser menyisipkan line break dan margin, tetapi
elemen q tidak akan menampilkan apapun yang khusus.
</p>
</body>
</html>
<body>
<p>
Bila browser Anda mendukung kemampuan bi-directional override (bdo), baris
berikut ini akan dituliskan dari kanan ke kiri (rtl):
</p>
<bdo dir="rtl">
Anggap saja ini tulisan bahasa Arab
</bdo>
<br>
Ini adalah contoh quotation panjang:
<blockquote>
Ini adalah quotation panjang. Ini adalah quotation panjang. Ini adalah quotation
panjang. Ini adalah quotation panjang. Ini adalah quotation panjang.
</blockquote>
Ini adalah contoh quotation pendek:
<q>
Ini adalah quotation pendek.
</q>
<p>
Menggunakan elemen blockquote, browser menyisipkan line break dan margin, tetapi
elemen q tidak akan menampilkan apapun yang khusus.
</p>
</body>
</html>
Category:
0
komentar
