Hari ini adalah refleksi hari kemarin .... "if you fill your heart with regrets of yesterday and the worries of tomorrow, you will have no day to be thankful for"

Kamis, 21 April 2011

latihan CSS eksternal

sekarang kita akan mempelajari css eksternal
simpan dengan nama eksternal.css

body
{
background-color: lightblue
}
h1
{
font-size:36pt; color: white
}
h2
{
color: blue
}
p
{
margin-left:50px
}



selanjutnya membuat script html simpan dengan nama eksternal.htm

<html>
<head>
<link rel="stylesheet" type="text/css" href="eksternal.css">
</head>
<body>
<h1>header ini ukurannya 36pt</h1>
<h2>header ini warnanya biru</h2>
<p>paragraf ini letaknya sebelah kiri dengan jarak 50px</p>
</body>
</html>

hasil :


Diposting oleh Defi Mendasari 0 komentar

Belajar menggunakan CSS

belajar menggunakan css internal
simpan dengan nama css_internal.htm

<html>
<head>
<style type="text/css">
body {background-image: url(jan11.jpg)}
HR {color: yellow}
P {font-size: 11pt; margin-left: 15px}
</style>
</head>
<body>
<p>ini contoh penggunaan css internal</p>
<hr>
</body>
</html>


penggunaan inline.
simpan dengan nama internal.htm

<html>
<head>
inline
</head>
<body>
<p style="color: red; margin-left: 20px">
internal css </p>
</body>
</html>


hasil :

css_internal.htm





internal.htm

Diposting oleh Defi Mendasari 0 komentar

Latihan Tabel dengan HTML (2)

melanjutkan postingan sebelumnya. sekarang kita akan belajar membuat table border. yuk ikuti !

<html>
<head>
<title>table 2</title>
</head>
<body>
<table border="1" width="500">
<tr>
<td>header kiri</td>
<td align="center" width="50%">header tengah</td>
<td align="right">header kanan</td>
</tr>
<tr>
<td valign="top" rowspan="2">menu kiri</td>
<td align="center" colspan="2" height="200">bagian isi</td>
</tr>
<tr>
<td align="center"> footer tengah</td>
<td align="right"> footer kanan</td>
</tr>
</table>
</body>
</html>

simpan dengan nama tabel2.htm

hasil :







mudah bukan ?? .. silahkan mencoba ..
Diposting oleh Defi Mendasari 0 komentar

Latihan Tabel dengan HTML (1)

huaaaaaaaaa masih semangat-semangat nulis ni teman-teman. heheheeh nama nya juga mahasiswa. harus memenuhi yang nama nya tugas kuliah. jiaaah jadi curhat pula disini. yuk langsung aja kita masuk pada materi selanjutnya. pada tulisan kali ini kita akan belajar membuat tabel. silahkan copy atau biar hafal ketik ulang script ini di notepad teman-teman.

<html>
<head>
<title>table 1</title>
</head>
<body>
<table>
<tr>
<td>aaaa</td>
<td>bbbb</td>
<td>cccc</td>
</tr>
<tr>
<td>dddd</td>
<td>eeee</td>
<td>ffff</td>
</tr>
</table>
</body>
</html>

simpan dengan nama tabel1.htm

hasil :



nah ternyata hasilnya seperti itu, ada 3 kolom dan 2 baris, tapi kok gak ada garis nya ya?? . sabar dulu. selanjutnya kita akan belajar membuat garisnya dengan menambahkan atribut border pada tag <table>
Diposting oleh Defi Mendasari 0 komentar

Belajar Membuat Form (4) dan (5)

pada latihan kali ini kita akan belajar membuat list.
simpan dengan nama form4.htm

<html>
<body>
nama-nama hewan :
<form>
<select name="animal">
<option value="kucing">kucing
<option value="jerapah">jerapah
<option value="ayam">ayam
<option value="harimau">harimau
<option value="singa">singa
</select>
</form>
</body>
</html>

selanjtnya kita akan belajar menggunakan tag <fieldset> dan <legend> untuk membuat frame. simpan dengan nama form5.htm

<html>
<body>
<fieldset>
<legend>
biodata fisik
</legend>
<form>
umur<input type="text" size="3">
berat<input type="text" size="3">
tinggi<input type="text" size="3">
</form>
</body>
</html>

hasil :


Diposting oleh Defi Mendasari 0 komentar

Belajar Membuat Form (2) dan (3)

lanjutan dari postingan sebelumnya. sekarang kita akan belajar bagaimana membuat checkbox dengan script html.

<html>
<body>
nama buat favorit :
<form>
<input type="checkbox" name="apel">apel
<br>
<input type="checkbox" name="pisang">pisang
</form>
</body>
</html>

simpan pada folder yang telah kita buat dengan nama form2.htm. jalankan pada browser anda.
dan buat page baru di notepad anda dengan contoh script dibawah ini :


<html>
<body>
jenis kelamin :
<form>
<input type="radio" checked name="sex">laki-laki
<br>
<input type="radio" checked name="sex">perempuan
</form>
</body>
</html>



simpan pada folder yang telah kita buat dengan nama form3.htm. jalankan pada browser anda.
selamat mencobaa ...


hasil :



Diposting oleh Defi Mendasari 0 komentar

Belajar Membuat Form (1)

pada postingan kali ini saya akan membahas tentang membuat form isian. berikut script yang harus kita ketik. jangan lupa save pada folder praktikum yang telah kita buat dengan nama form1.htm. selamat mencoba.

<html>
<body>
<form>
<tr>
<td>first name</td>
<input type="text" name="firstname">
<br>
<td>last name</td>
<input type="text" name="lastname">
</tr>
</form>
</html>

jalan kan file htm yang telah anda simpan pada browser anda dan anda akan melihat hasil seperti dibawah ini 

hasil :


Diposting oleh Defi Mendasari 0 komentar