April 2011 ~ Semua Ada Disini

Kamis, 21 April 2011

Pemrograman Web CSS (4)

Cara Penggunaan CSS

CSS 1

Tag HTML :

<html>

<head>
<link rel="stylesheet"type="text/css"href="external.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>

Tag CSS :

body

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

Postingan Oleh .. aNdie .. On 19.12 Tidak Ada Komentar Baca Selengkapnya

Pemrograman Web HTML (3)

Cara Membuat Tabel

Tag HTML :

Tabel 1

<html>
<head>
<tittle><font face="firewalk36" color="green">table_1</font></tittle>
</head>
<body>
<table border="1">
<tr>
<td><font face="firewalk36" color="green"> belajar </td>
<td><font face="firewalk36" color="green"> pemrograman </td>
<td><font face="firewalk36" color="green"> web </td>
</tr>

<tr>
<td><font face="firewalk36" color="green"> materinya </td>
<td><font face="firewalk36" color="green"> tentang </td>
<td><font face="firewalk36" color="green"> tabel </td>
</font>
</tr>
</table>
</body>
</html>

Postingan Oleh .. aNdie .. On 18.35 Tidak Ada Komentar Baca Selengkapnya

Rabu, 20 April 2011

Pemrograman Web HTML (2)

Cara Menampilkan Daftar Item / List

Tag HTML :

List 1

<html>

<head>

<title> Contoh Pemakaian Tag UL </title>

</head>

<body>

<h2> Aneka Buah Yang Segar : </h2>

<ul>

<li>Anggur</li>

<li>Mangga</li>

<li>Jeruk</li>

<li>Pisang</li>

</ul>

</body>

</html>

Hasilnya :

List 2

<html>
<head>
<title> Contoh Pemakaian Tag OL </title>
</head>

<body>
<h2> Aneka Buah Yang Segar : </h2>
<ol type="1">
<li>Anggur</li>
<li>Mangga</li>
<li>Apel</li>
<li>Jeruk</li>
<li>Pisang</li>
</ol>

<h2> Aneka Buah Yang Segar : </h2>
<ol type="a">
<li>Anggur</li>
<li>Mangga</li>
<li>Apel</li>
<li>Jeruk</li>
<li>Pisang</li>
</ol>

</body>
</html>

Hasilnya :

Postingan Oleh .. aNdie .. On 22.41 Tidak Ada Komentar Baca Selengkapnya

Pemrograman Web HTML (1)

Tag HTML Sederhana (Hello World)

Tag HTML :

<html

<head>

</head>

<body>

<p> Hello World ! <br> Welcome to <i> My HTML Page </i></p>

</body>

</html>

Hasil Tampilan di Browser :

Postingan Oleh .. aNdie .. On 21.40 Tidak Ada Komentar Baca Selengkapnya

Senin, 18 April 2011

Mengatur Teks HTML

Mengatur Teks Secara Fisik

HTML menggunakan sejumlah tag yang berguna untuk mengatur bentuk teks secara fisik. Dengan tag-tag ini antara lain kawan bisa membuat teks yang tebal, miring, diberi garis bawah, dan lain-lain.

Tag-tagnya adalah sbb :

<b> .. </b> : teks ditampilkan dalam keadaan ditebalkan
<i> .. </i> : teks ditampilkan dalam keadaan miring
<u> .. </u> : teks ditampilkan dengan diberi garis bawah
<big> .. </big> : teks ditampilkan dalam ukuran lebih besar dari ukuran normal
<small> .. </small> : teks ditampilkan dengan ukuran lebih kecil dari ukuran normal
<sub> .. </sub> : teks ditampilkan sebagai subskrip
<sup> .. </sup> : teks ditampilkan sebagi superskrip
<tt> .. </tt> : teks ditampilkan dalam bentuk ketikan seperti mesin ketik

Contoh penggunaan tag-tag diatas adalah sbb :

<html>
<head>
<title> Memformat Secara Fisik </title>
</head>
<body>
Teks dengan ukuran NORMAL<br>
<small> Teks dengan tag SMALL </small><br>
<big> Teks dengan tag BIG </big><br>
<hr>
Teks Normal<br>
<b> Teks Tebal </b><br>
<i> Teks Miring </i><br>
<u> Teks Garis Bawah </u><br>
Normal<sub>Teks dengan tag SUB</sub><br>
Normal<sup>Teks dengan tag SUP</sup><br>
<tt> Teks seperti ketikan mesin ketik </tt><br>
</body>
</html>

Kemudian simpan file yang kawan ketikkan tadi di folder Latihan HTML dengan nama latihan6.htm. Setelah file tadi disimpan, buka folder yang kawanku buat tadi kemudian open file tsb di browser yang kawan gunakan (ex: Mozilla Firefox).

Hasilnya :

Postingan Oleh .. aNdie .. On 19.43 Tidak Ada Komentar Baca Selengkapnya

Dasar HTML (2)

4. Menggunakan Tag Judul

HTML menyediakan 6 buah tag yang digunakan untuk mengatur ukuran teks yang digunakan dijadikan sebagai judul dalam badan dokumen. Tag-tag judul ini berupa :

<h1> ... </h1>
<h2> ... </h2>
<h3> ... </h3>
<h4> ... </h4>
<h5> ... </h5>
<h6> ... </h6>

Contoh yang saya berikan berikut ini memberikan gambaran penggunaan tag <h1> untuk membuat judul : Pesona Tanaman Hias agar ditampilkan berukuran besar.

<html>

<head>

<title> Contoh Pengaturan Judul </title>

</head>

<body>

<p>

<h1> Pesona Tanaman Hias </h1><p>

Keindahan tanaman hias<br>

membawa suatu pesona tersendiri<br>

warna-warni bunga <br>

aneka rupa corak daun<br>

membuat orang dengan senang hati mengoleksinya<br>

</p>

</body>

</html>

Kemudian simpan file yang kawan ketikkan tadi di folder Latihan HTML dengan nama latihan4.htm. Setelah file tadi disimpan, buka folder yang kawanku buat tadi kemudian open file tsb di browser yang kawan gunakan (ex: Mozilla Firefox).

Hasilnya :

5. Membuat Garis Horizontal

Untuk memperindah tampilan, seringkali pembuat dokumen Web menambahkan garis horizontal. Garis ini sebenarnya dapat dibuat dengan mudah, yaitu dengan menyertakan tag <hr>. Berikut contoh kode HTML yang menggunakan tag <hr>.

<html>
<head>
<title> Tag HR </title>
</head>
<body>
<h2> Aneka Buah yang Segar </h2>
<hr>
Anggur
<hr>
Apel
<hr>
Jeruk
<hr>

dan lain-lain
<hr>
</body>
</html>

Kemudian simpan file yang kawan ketikkan tadi di folder Latihan HTML dengan nama latihan5.htm. Setelah file tadi disimpan, buka folder yang kawanku buat tadi kemudian open file tsb di browser yang kawan gunakan (ex: Mozilla Firefox).

Hasilnya :

Sekian dulu pelajaran dasar HTML yang saya ketahui. Bagi kawan2ku yang ingin menambahnya, silahkan berikan komentarnya yaa...

C U Next Time... :))

Postingan Oleh .. aNdie .. On 19.00 Tidak Ada Komentar Baca Selengkapnya

Dasar HTML (1)

1. Menulis Kode HTML yang Pertama

Kawanku semua, kita sudah tahu bahwa HTML adalah sebuah bahasa pemrograman. Untuk membuat sebuah halaman web, kawanku semua bisa menulisnya secara langsung di editor teks seperti Notepad di lingkungan Windows maupun secara tidak langsung melalui perangkat lunak seperti FrontPage di lingkungan windows atau Quanta di lingkungan Linux. Dibawah ini saya berikan contoh kode HTML yang sangat sederhana.

<html>

<head>

<title> Latihan Pertama </title>

</head>

<body>

Selamat Belajar HTML

</body>

</html>

kemudian buatlah sebuah folder di disk (D: Local Disk) kawan2 dengan nama Latihan HTML. Lalu simpan file yang kawan ketikkan tadi di folder Latihan HTML dengan nama latihan1.htm. Setelah file tadi disimpan, buka folder yang kawanku buat tadi kemudian open file tsb di browser yang kawan gunakan (ex: Mozilla Firefox).

Hasilnya :

2. Menggunakan Tag <br>

Tag <br> merupakan tag html yang digunakan untuk berpindah ke baris baru dari baris sebelumnya. Dibawah ini saya berikan contoh kode html yg menggunakan tag <br>.

<html>

<head>

</head>

<body>

Selamat Belajar HTML <br>

Semoga Sukses !

</body>

</html>

Kemudian simpan file yang kawan ketikkan tadi di folder Latihan HTML dengan nama latihan2.htm. Setelah file tadi disimpan, buka folder yang kawanku buat tadi kemudian open file tsb di browser yang kawan gunakan (ex: Mozilla Firefox).

Hasilnya :

3. Menggunakan tag <P>

Tag <p> merupakan tag html yang digunakan untuk mengatur paragraf dalam suatu kode html yang dibuat. Setelah selesai menuliskan paragraf dengan tag <p> ini, kemudian tutup dengan tag </p> di akhir penulisan. Tag <p> ini memiliki beberapa atribut. Salah satu contohnya adalah atribut "ALIGN", yang berarti jenis paragraf yang digunakan. didalam atribut ini "ALIGN" terdapat beberapa nilai atribut. Salah satunya adalah "CENTER" yang berarti paragraf akan membuat rata tengah di tampilannya.

Contoh kode html yang menggunakan tag<p>...</p>

<html>

<head>

</head>

<body>

PUISIKU <br>

Mataharipun mulai terbangun dari mimpi <br>

menyinarkan sinarnya yang hangat <br>

Burung-burung berkicau berkicau riang <br>

mengucapkan selamat pagi <br><br>

Pekanbaru, 2010

</p>

</body>

</html>

Lalu simpan file yang kawan ketikkan tadi di folder Latihan HTML dengan nama latihan3.htm. Setelah file tadi disimpan, buka folder yang kawanku buat tadi kemudian open file tsb di browser yang kawan gunakan (ex: Mozilla Firefox)

Hasilnya :

Bersambung... (Dasar HTML 2)

Postingan Oleh .. aNdie .. On 14.25 Tidak Ada Komentar Baca Selengkapnya

Minggu, 17 April 2011

Selamat Datang

Assalamu'alaikum wr.wb....

Selamat Datang di blog saya...
Blog ini saya buat untuk mengajak kawan2 semua buat sharing pengetahuan tentang ilmu komputer..
So... Buat kawan2 yg punya pengetahuan lebih tentag ilmu komputer,, sharing disini yaa..
biar kita bisa belajar bersama...
Ocee.... :))

Postingan Oleh .. aNdie .. On 17.11 Tidak Ada Komentar Baca Selengkapnya

Semua Ada Disini

Study... Information... Entertainment... ETC

Kamis, 21 April 2011

Pemrograman Web CSS (4)

Pemrograman Web HTML (3)

Rabu, 20 April 2011

Pemrograman Web HTML (2)

Pemrograman Web HTML (1)

Senin, 18 April 2011

Mengatur Teks HTML

Dasar HTML (2)

Dasar HTML (1)

Minggu, 17 April 2011

Selamat Datang

Kotak Pesan

Arsip Blog

Like Us Here

Kategori

Blogger news

Blogroll