Colspan & Rowspan

Kali ini saya akan membahas atribut colspan & rowspan pada pemrograman web menggunakan script HTML. Kedua atribut tersebut merupakan atribut yang sangat penting di dalam salah satu tag HTML yaitu tag 'table'. Tanpa kedua atribut tersebut, tidak mungkin kita dapat membuat & memperindah halaman web yang kita buat.
Pertama-tama saya akan memberikan contoh table yang menggunakan atribut Colspan. Colspan digunakan untuk menggabungkan 2 buah kolom atau lebih pada suatu table. Contohnya seperti di bawah ini....



header
123
4 56
789

Scriptnya....


<table border="1">
 <tr>
  <td colspan="3">header</td>
 </tr>
 <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
 </tr>
 <tr>
  <td>4</td>
  <td>5</td>
  <td>6</td>
 </tr>
 <tr>
  <td>7</td>
  <td>8</td>
  <td>9</td>
 </tr>
</table>
Perhatikan tampilan table yang saya buat di atas. Yang digabung adalah kolom teratas, atributnya adalah colspan="3", angka 3 adalah jumlah kolom terbanyak yang ada pada table yang kita buat.

Kemudian setelah itu, saya akan meberikan contoh table yang meggunakan atribut Rowspan. Rowspan digunakan untuk menggabungkan 2 baris atau lebih pada suatu table. Contohnya seperti di bawah ini...



menu
123
456
789

Scriptnya....


<table border="1">
 <tr >
  <td rowspan="4">menu</td>
 </tr>
 <tr>
  <td>1</td>
  <td>2</td>
  <td>3</td>
 </tr>
 <tr>
  <td>4</td>
  <td>5</td>
  <td>6</td>
 </tr>
 <tr>
  <td>7</td>
  <td>8</td>
  <td>9</td>
 </tr>
</table>
Perhatikan tampilan table yang saya buat di atas. Yang digabung adalah baris paling kiri, atributnya adalah rowspan="4", angka 4 adalah jumlah baris terbanyak yang ada pada table yang kita buat.

Bagaimana?Mudah sekali bukan??
Memang pemrograman web adalah pemrograman yang paling mudah daripada yang lainnya(makanya saya menyukainya, jiahahaha).
Selengkapnya...

CSS(Cascading Style Sheets)

Bagi para programer web pasti sudah tahu apa itu CSS. Ya, CSS adalah script yang digunakan bersamaan dengan script HTML pada pemrograman web. CSS sangat berguna sekali untuk memperindah halaman web yang kita buat karena memiliki ratusan properties & values yang dapat kita pergunakan. Script CSS bisa di tulis di dalam HTML(internal) bisa juga ditulis di luar tag HTML(eksternal) jadi sangat flexibel. Tapi menurut saya lebih baik menggunakan eksternal saja agar lebih mudah kita analisa jika terjadi kesalahan.

Sekarang saya akan memberi contoh script CSS internal dahulu....


<html>
<head>
<style>
body.bg{background-color:yellow}
.merah{color:red}
.hitam{color:black}
.biru{color:blue}
</style>
<body class="bg">
<span class="merah">Teks Berwarna Merah</span><br>
<span class="hitam">Teks Berwarna Hitam</span><br>
<span class="biru">Teks Berwarna Biru</span>
</body>
</html>

Dan tampilan pada browser anda akan seperti ini....





Mudah bukan??? nah sekarang jika anda ingin belajar CSS Eksternal silahkan Download disini!!!
Selengkapnya...

Klik Kanan - Refresh


Menurut hasil penelitian saya(cieh bahasanya ngeri cuy), hampir dari semua pengguna komputer yang telah saya jumpai sering sekali melakukan "kegiatan" Klik Kanan - Refresh. Tak tahu apa sebabnya mereka sering melakukan hal ini padahal mereka telah melekukan hal tersebut berulang-ulang kali sebelumnya. Sungguh tak berguna, tapi jujur saya pun mempunyai kebiasaan seperti itu, jiahahahaha :))

Saya memperhatikan yang sering menggunakan OS Windows selalu berulang-ulang melakukan hal itu, bahkan gawatnya ada pula yang saya jumpai pengguna OS Linux(Ubuntu) sering melakukan hal tersebut juga padahal tidak kita tahu bahwa OS Linux(Ubuntu) tidak menyediakan fasilitas Klik Kanan - Refresh, Aneh bukan? saya aja bingung sendiri :-S. Apakah mereka begitu karena telah bertahun-tahun selalu menggunakan OS Windows sehingga melakukan hal tersebut juga pada OS lainnya. Jawabannya silahkan anda temukan sendiri :))
Selengkapnya...

Award ke-2

Terima kasih buat sahabat blogger Aeophobia yang telah memberikan award ini kepada saya. Suatu kehormatan bagi saya untuk mempostingkan award ini(widih bahasanya tinggi amat, hehehe).

Bagi sahabat blogger yang ingin mengambil award ini dipersilahkan untuk mengkopi paste picture di atas setelah itu tinggal di postingkan ke blog anda. Jika berkenan silahkan menyertakan link pemberi award.

Segera di ambil ya, mumpung gratis loh.....!!!!!


Selengkapnya...

My First Google Page Rank

Sudah lama saya tidak blogging, ga tau tiba-tiba begitu saya ke warnet dan iseng-iseng buka blog, ternyata eh ternyata Google Page Rank saya bertambah 1 peringkat.


Hehe, seneng juga ya padahal saya jarang blogwalking, eh ternyata bisa naik peringkat. Terima kasih buat teman-teman yang telah mendukung blog saya. HIDUP BLOGGER INDONESIA!!!!


Selengkapnya...

Tutorial Penggunaan XAMPP

Bagi anda yang hobi dengan pemrograman web dengan menggunakan PHP, anda pasti membutuhkan software penunjang dalam membuat program dengan menggunakan PHP. Banyak sekali software-software pendukung untuk dapat membuat program menggunakan script PHP, salah satunya adalah XAMPP, software yang akan saya bahas disini.
XAMPP versi 1.7.2 sudah mencakup software-software untuk menjalankan PHP seperti :
  • Apache 2.2.12 (IPv6 enabled) + OpenSSL 0.9.8k
  • MySQL 5.1.37 + PBXT engine
  • PHP 5.3.0
  • phpMyAdmin 3.2.0.1
  • Webalizer 2.21-02 + GeoIP lite
  • FileZilla FTP Server 0.9.32
jadi anda tidak perlu lagi menginstall satu demi satu seluruhsoftware tersebut. Jika ingin mendownload silahkan klik disini.

Berikut ini saya akan memberikan tutorial untuk menggunakan Software XAMPP mulai dari proses instalasi sampai dengan penggunaannya.
Pertama-tama klik 2 kali software tersebut dan akan ada tampilan sebagai berikut...



Pilih direktori tempat anda menginstall program tersebut atau biarkan saja secara default akan tersimpan di C:\xampp\.
Setelah instalasi sukses maka ssegeralah open explorer anda(IE atau Windows Explorer). 'Tulis localhost' maka akan tampil...














Jika tampilan yang muncul seperti itu maka XAMPP berhasil anda install.

Untuk penggunaannya, pertama-tama buat dahulu script PHP anda kemudian simpan di direktori htdocs yang ada di dalam direktori XAMPP yang anda simpan tadi(Default = C:\xampp\htdocs) kemudian buat folder baru untuk script anda. Di dalam tutorial ini saya akan menggunakan script perulangan for seperti ini yang di bawah ini :

<?php
for ($i=0; $i<=91; $i=$i+7)
{
echo $i." " ;
}
?>

Kemudian simpan file tersebut ke direktori yang telah saya sebutkan di atas. Jika ingin menjalankan script tersebut, silahkan anda buka explorer dan ketik localhost\namafolder\ maka akan tampil...













Kemudian silahkan anda klik sekali saja file .php yang ingin anda jalankan maka script anda akan jalan dengan tampilan seperti ini...















Ya begitulah tutorial yang sangat sederhana dari saya, jika ada kekurangan, harap dimaklumi mengingat saya juga baru belajar, hehe (^-^)?

Selengkapnya...

Tips Menuliskan kode HTML

Kita sering bertanya-tanya, bagaimanakah cara untuk menuliskan kode-kode html pada postingan blog kita karena jika kita mencoba menuliskan kode HTML, kode tersebut tidak dapat tertampil sebagai teks, jadi saya akan memberitahu cara agar kode-kode HTML yang kita tulis bisa dimuat di postingan blog kita.

Pertama-tama saya akan memberi contoh kode HTML yang bisa terbaca sebagai teks, lihat contoh di bawah ini...

<html>
<head>
<title>Tips menulis kode HTML</title>
</head>
<body>
Ini adalah contoh script HTML yang dapat ditampilkan di postingan blog....
</body>
</html>
Nah, sekarang saya akan memberitahu caranya. Kode-kode tersebut dapat tertulis karena karakter-karakter tertentu yang ada di kode tersebut diganti dengan sebuah 'teks' yang dapat dibaca oleh browser kita yang disebut dengan HTML entities. Sebenarnya ada cara praktis untuk meng-convert langsung teks tersebut yaitu dengan mengunjungi web ini. Tetapi saya ingin membuatnya secara manual agar kita semua dapat sekalian belajar mengenai HTML.

Ok langsung aja yah, pertama kita harus mempunyai script untuk menampilkan kode yang ingin kita munculkan di postingan kita, yaitu...
<div class="wp_syntax">
<div class="code">
<pre class="html" style="font-family: monospace;">
taruh kode HTML kamu disini.....
</pre>
</div>
</div>
Setelah itu kode yang akan kita buat, kita ubah dulu beberapa entity-entity khusus HTML menjadi karakter yang dapat dibaca oleh web browser kita, misalnya entity '<' menjadi '&lt;'. Berikut adalah daftar beberapa entity yang ada pada HTML....

KarakterNomor EntityNama EntityDeskripsi
"&#34;&quot;petik dua
'&#39;&apos; (tidak berlaku di IE)apostrop
&&#38;&amp;dan
<&#60;&lt;kurang dari
>&#62;&gt;lebih dari

Entity-entity yang lain selengkapnya dapat anda lihat disini.

Setelah anda mengganti semua karakter-karakter yang khusus menjadi entity-entity, kemudian silahkan anda kopi paste ke dalam script untuk menampilkan kode seperti di atas.

Bagaimana??? Mudah Bukan....!!!!
Meskipun artikel yang saya tulis sangat sederhana, saya harap artikel saya dapat digunakan bagi anda yang ingin belajar HTML. Selamat Mencoba!!!

Selengkapnya...