Senin, 08 September 2014

CARA MEMBUAT ATRIBUT DALAM TAG BODY HTML


Attributes

Attribute Value Description
alink color Not supported in HTML5.
Specifies the color of an active link in a document
background URL Not supported in HTML5.
Specifies a background image for a document
bgcolor color Not supported in HTML5.
Specifies the background color of a document
link color Not supported in HTML5.
Specifies the color of unvisited links in a document
text color Not supported in HTML5.
Specifies the color of the text in a document
vlink color Not supported in HTML5.
Specifies the color of visited links in a document

HTML <body> alink Attribute

Contoh :
<html>
<body alink="green">
<p><a href="http://smkn 3 buduran">Selamat datang di smkn 3 buduran </a></p>
<p><a href="http://smkn 3 buduran">STEMAPAL JAYA</a></p>
</body>
</html>


HTML <body> background Attribute

Contoh :
<html>
<body background="bgimage.jpg">
<h1>Hello friends!</h1>
<p><a href="http://smkn 3 buduran">Peraturan-peraturan!</a></p>
</body>
</html>

HTML <body> bgcolor Attribute

Contoh :
<html>
<body bgcolor="#E6E6FA">
<h1>Hello kawan!</h1>
<p><a href="http://smkn 3 buduran">Tata tertib smkn 3 buduran!</a></p>
</body>
</html>

HTML <body> link Attribute

  Contoh :
<html>
<body link="blue">
<p><a href="http://smkn 3 buduran">Profil smkn 3 buduran</a></p>
<p><a href="http://stemapal">Gambaran umum smkn 3 buduran</a></p>
</body>
</html>
 
 

HTML <body> text Attribute

  Contoh :
<html>
<body text="green">
<h1>Hello kawan!</h1>
<p><a href="http://smkn 3 buduran">Tujuan dan visi misi</a></p>
</body>
</html>

HTML <body> vlink Attribute


  Contoh :
<html>
<body vlink="red">
<p><a href="http://smkn 3 buduran.com">Tujuan smkn 3 buduran </a></p>
<p><a href="http://stemapal/">visi misi</a></p>
</body>
</html>

 


 



 



 

 

 


 

Diposting oleh di Tidak ada komentar:

Sabtu, 23 Agustus 2014

cara membuat tabel pada HTML

CARA MEMBUAT TABEL PADA HTML

Mengenal Struktur Tabel HTML
Tabel dalam HTML ditandai dengan kode <tabel> dan diakhir dengan </tabel>. Untuk membuat baris di dalam tabel menggunakan kode <tr> (tr singkatan table row), dan pada setiap baris mesti memiliki kolom-kolom, untuk membuat kolom menggunakan kode <td> (td singkatan table data). Data yang ada pada kolom bisa berupa text, angka, gambar, link. Berikut struktur lengkap Tabel HTML:
<table>
<tr>
<td></td>
</tr>
</table>
Contoh Membuat Tabel
Masukkan kode berikut ke notepad :
<table border=”1″>
<tr>
<td>No</td>
<td>Nama Mahasiswa</td>
<td>Alamat</td>
<td>Semester</td>
</tr>
<tr>
<td>1</td>
<td>Bandi</td>
<td>Surabaya</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>Agung Firmansyah</td>
<td>Jakarta</td>
<td>8</td>
</tr>
</table>
Kemudian save dan beri nama tabel.html Save as Type-nya pilih All Files. Buka tabel.html menggunakan firefox/internet explorer/google chrome, akan tampil seperti di bawah ini:
No
Nama Mahasiswa
Alamat
Semester
1
Bandi
Surabaya
5
1
Agung Firmansyah
Jakarta
8
Cara Membuat Tabel HTML memakai Atribut :
Untuk mendesain tabel supaya bisa terlihat lebih indah memerlukan atribut tambahan yang bekerja pada tag <table>. Berikut atribut tag tabel yang diperlukan:
  • Tabel Header
Tabel header digunakan untuk membedakan data header dan data konten pada tabel. Tabel header menggunakan tag <th>, berikut contohnya:
<table border=”1″>
<tr>
<th>No</th>
<th>Nama Mahasiswa</th>
<th>Alamat</th>
<th>Semester</th>
</tr>
<tr>
<td>1</td>
<td>Bandi </td>
<td>Surabaya</td>
<td>5</td>
</tr>
</table>
Hasil:
No
Nama Mahasiswa
Alamat
Semester
1
Bandi
Surabaya
5
  • Tabel Caption
Table Caption berfungsi untuk memberikan penamaan pada tabel. Didefinisikan dengan tag <caption>. Contoh penggunaan, tambahan kode <caption>Tabel Mahasiswa</caption> di bawah tag <table>. Hasilnya menjadi:
Tabel Mahasiswa
No
Nama Mahasiswa
Alamat
Semester
1
Bandi
Surabaya
5

  • Penggabungan Kolom dan Baris
Menggabungkan beberapa kolom menjadi satu kolom menggunakan atribut colspan , sedangkan untuk menggabungkan baris menggunakan atribut rowspan. Contoh penggunaan:
Penggunaan Atribut colspan:
<table border=”1″>
<tr>
<td colspan=”2″>Gabungan Kolom 1 dan 2 pada Baris 1</td>
</tr>
<tr>
<td style=”width:50%”>Baris 2 Kolom 1</td>
<td>Baris 2 Kolom 2</td>
</tr>
<tr>
<td>Baris 3 Kolom 1</td>
<td>Baris 3 Kolom 2</td>
</tr>
</table>
Hasil:
Gabungan Kolom 1 dan 2 pada Baris 1
Baris 2 Kolom 1
Baris 2 Kolom 2
Baris 3 Kolom 1
Baris 3 Kolom 2
Penggunaan Atribut rowspan:
<table border=”1″>
<tr>
<td rowspan=”2″>Gabungan Baris 1 dan 2 pada Kolom 1</td>
<td>Baris 1 Kolom 2</td>
</tr>
<tr>
<td>Baris 2 Kolom 2</td>
</tr>
<tr>
<td>Baris 3 Kolom 1</td>
<td>Baris 3 Kolom 2</td>
</tr>
</table>
Hasil:
Gabungan Baris 1 dan 2 pada Kolom 1
Baris 1 Kolom 2
Baris 2 Kolom 2
Baris 3 Kolom 1
Baris 3 Kolom 2
  • Pengaturan Jarak pada kolom
Pengaturan jarak antara text dengan kolom tabel menggunakan cellpadding dan cellspacing. celpadding berarti mengatur jarak dari sisi bagian dalam kolom, sedangkan cellspacing mengatur jarak dari sisi bagian luar kolom. Contoh penggunaan:
Atribut cellpadding:
<table border=”1″ celpadding=”10″>
<tr>
<th>No</th>
<th>Nama Mahasiswa</th>
<th>Alamat</th>
<th>Semester</th>
</tr>
<tr>
<td>1</td>
<td>Bandi </td>
<td>Surabaya</td>
<td>5</td>
</tr>
</table>
Hasil:
No
Nama Mahasiswa
Alamat
Semester
1
Bandi
Surabaya
5
Atribut cellspacing:
<table border=”1″ cellspacing=”10″>
<tr>
<th>No</th>
<th>Nama Mahasiswa</th>
<th>Alamat</th>
<th>Semester</th>
</tr>
<tr>
<td>1</td>
<td>Bandi </td>
<td>Surabaya</td>
<td>5</td>
</tr>
</table>
Hasil:
No
Nama Mahasiswa
Alamat
Semester
1
Bandi
Surabaya
5
  • Tabel Background
Untuk memperindah tampilan tabel salah satunya dengan mengatur warna dari tabel. Berikut contoh pengaturan warna pada tabel:
<table border=”1″ celpadding=”10″ style=”background:#eee;”>
<tr style=”background:red;”>
<th>No</th>
<th>Nama Mahasiswa</th>
<th>Alamat</th>
<th>Semester</th>
</tr>
<tr>
<td>1</td>
<td>Agung Firmansyah </td>
<td>Jakarta </td>
<td>8</td>
</tr>
</table>
Hasil:
No
Nama Mahasiswa
Alamat
Semester
1
Agung Firmansyah
Jakarta
8

Keterangan :
Di dalam tabel, kita bisa bisa beberapa atribut di dalamnya, antara lain yaitu:
1.   bgcolor : untuk mengatur warna background/warna latar belakang tabel. Penempatan kodenya seperti ini : bgcolor="kode warna".
2.  align : untuk mengatur tata letak tulisan yang ada pada tabel, mau rata kiri, tengah, rata kanan, atau rata kiri-kanan. Penempatan kodenya : align="left"|"center"|"right" .
 3. cellpadding : untuk mengatur jarak antara tepi sel dengan isi sel di dalam sebuah tabel. Penempatan kodenya : cellpadding="pixel" .
 4. border : untuk mengatur tingkat ketebalan garis tepi pada tabel. Penempatan  kodenya : boeder="pixel" .
 5. cellspacing : untuk mengatur jarak antara sel. Penempatan kodenya : cellspacing="pixel" .
6. height : untuk mengatur tinggi tabel. penempatan kodenya : height="pixel"|"%" .
7. valign : untuk mengatur posisi vertikal. penempatan kodenya : valign="top"|"middle"|"bottom"
8. colspan : untuk mengatur kolom. Penempatan kodenya : colspan="nomor" .

9. rowspan : untuk mengatur row atau baris. Penempatan kodenya : rowspan="nomor"
Diposting oleh di Tidak ada komentar:

Jumat, 08 Agustus 2014

Hardware dan Software

HARDWARE

       Pengertian Hardware atau Perangkat Keras adalah komponen pada komputer yang dapat terlihat dan disentuh secara fisik.

Contoh dari Hardware adalah sebagai berikut:


~ Perangkat Masukan (Input Device): Merupakan Hardware yang digunakan untuk memasukkan data, baik berupa teks, foto, maupun gambar ke dalam komputer.
   Contohnya adalah Keyboard, Mouse, Scanner, Joystick dan microphone.
1.         Keyboard
key
Keyboard merupakan alat untuk memasukkan data maupun perintah ke CPU, biasanya terdiri atas rangkaian huruf, angka, dan tombol fungsi lainnya.


 2.         Mouse
mouse
Mouse merupakan alat bantu untuk memberikan perintah dalam memproses data atau mengedit data.


3.     Scanner
scan
Scanner merupakan alat Bantu untuk memasukkan data berupa gambar atau grafik dan mengubahnya ke dalam bentuk digital sehingga dapat diproses dan digabungkan dengan bentuk data yang berupa teks.

~ Perangkat Pemrosesan: Merupakan Hardware yang terdapat pada sebuah komputer untuk memproses masukkan/input dari pengguna.
   Contohnya : CPU, DVD Room dan prosesor pada sebuah komputer.
1.         CPU (Central Processing Unit)
cpu
Merupakan alat yang berfungsi sebagai pemroses data.CPU berisi rangkaian sirkuit yang menyimpan instruksi-instruksi pemrosesan dan penyimpanan data.


~ Perangkat Keluaran (Output Device): Merupakan Hardware yang digunakan untuk menghasilkan suatu proses (output) dari pengguna komputer (User).
   Contohnya adalah Monitor, Printer, Speaker dan Earphone
1.        Monitor
moni
Merupakan alat yang mampu menampilkan teks maupun gambar dari data yang sedang diproses dalam CPU.



2.         Printer
print
Priter merupakan alat yang memproduksi keluaran data (output) berbentuk cetak, berupa teks maupun gambar/grafik.



~ Perangkat penyimpanan : Merupakan Hardware yang digunakan untuk menyimpan sebuah data.
   Contohnya adalah Disket(Floppy Disk),HardDisk,FlashDisk,CD dan RAM/ROM.

1.         Floppy Disk
plop
Floppy disk merupakan alat tambahan untuk menyimpan atau menuliskan ke dalam disket maupun sebaliknya, ukuran yang umum digunakan adalah ukuran 3,5 inchi.

 2.         Harddisk
hrdisk
Harddisk merupakan alat tambahan untuk menyimpan data dalam kapasitas besar yang dilapisi secara magnetis, saat ini perkembangan harddisk sangat cepat dari daya tampung dan kecepatan membacadata.Perlu kalian ketahui saat ini harddisk memang mutlak ada dalam setiap computer atau laptop sebagai penyimpan sistem operasi yang permanen.
3.     Flasdiks
Flasdisk merupakan tempat penyimpanan data yang paling digemari karena kapasitasnya yang besar dan beragam selain itu ukurannya yang kecil memudahkan kita untuk membawanya kemana-mana, hadirnya flasdisk telah menggantikan floppy disk yang dulu sering digunakan untuk penyimpanan data yang portable, kapasitas minimum flashdis adalah 128mb sedangkan untuk kapasitas maksimumnya bisa mencapai 40 Gb, lebih kecil dibanding Hardisk                              External yang kapasitasnya bisa mencapai 1 tera bite (1000 Gb).

 SOFTWARE

     Pengertian Software atau Perangkat Lunak adalah data-data yang terdapat pada sebuah komputer yang diformat kemudian disimpan secara digital. Bisa dibilang bahwa Software merupakan komponen yang tidak terlihat secara fisik, tetapi terdapat dalam sebuah komputer. 

Contoh dari Software adalah sebagai berikut:


Pengertian Hardware, Software, dan Brainware
gambar: LibreOffice

  1. Sistem Operasi: Merupakan Software yang digunakan untuk menghubungkan antara Hardware dengan Pengguna/User.
  2. Software Aplikasi: Merupakan Software yang dapat diaplikasikan untuk memenuhi kebutuhan pengguna. Contohnya adalah Software paket aplikasi perkantoran seperti Libre Office dan Microsoft Office

Beberapa fungsi dari software  :
1. Untuk menghubungkan perangkat keras dengan brainware
2. Sebagai alat pembantu
3. Sebagai alat pemogram 


Diposting oleh di Tidak ada komentar:
Langganan: Komentar (Atom)