Cari Blog Ini

Jumat, 03 Agustus 2018

macam- macam tag pada html dan fungsinya

sebagai pengguna baru apa itu tag html ,dalam hal ini tag pada html adalah untukmembuat tampilan pada WEB yang akan kita buat agar lebih menarik, dan terkeasan lebih rapi pada penataan source code yang akan di gunakan.

apa aja macam -macam tag html dan fungsi kegunaan nya ?


TagKeterangan
<!-- ... -->Digunakan untuk memberi sebuah komentar atau keterangan. Kalimat yang terletak pada kontiner ini tidak akan terlihat pada browser
<!DOCTYPE> Mendefinisikan informasi tipe dokumen 
<a>Mendefinisikan sebuah anchor, tetapi lebih tepat jika diartikan sebagai tautan dikarenakan tautan ini digunakan untuk saling menautkan antara satu dokumen HTML ke dokumen HTML yang lain 
<abbr>Digunakan untuk menguraikan satu ungkapan yang disingkat dan Anda dapat memberikan informasi bermanfaat kepada penelusur-penulusur page source(halaman sumber kode) / pembaca layar, sistem terjemahan dan mesin pencari yang berasal dari singkatan yang sudah diuraikan, tetapi saat di browser uraian tersebut tidak akan tampil dan hanya sebagai informasi saja
<acronym>Mendefinisikan akronim / fungsi tag ini kurang lebih sama dengan tag <abbr>
<address>Mendefinisikan informasi kontak untuk penulis/pemilik dokumen
<applet>Digunakan untuk memasukan file java kedalam dokumen HTML
<area />Mendefinisikan daerah yang dapat diklik (link) pada peta gambar
<b>Membuat teks tebal
<base />Mendefinisikan URL dasar/target untuk semua URL relatif dalam dokumen
<basefont />Membuat atribut teks default, seperti warna, ukuran, jenis font untuk semua teks dalam dokumen
<bdo>Digunakan untuk menimpa arah teks
<big>Memperbesar ukuran teks sebesar satu point dari defaultnya
<blink>Membuat teks berkedip
<blockquote>Mendefinisikan sebuah kutipan panjang. Pada saat di browser teks akan tampil menjorok kedalam 
<body>Mendefinisikan body/isi dokumen HTML, berfungsi untuk menentukan bagaimana isi suatu dokumen ditampilkan di web browsernya. Isi dokumen tersebut dapat berupa teks, gambar, animas, link dan seterusnya
<br />Memberi baris baru/pindah baris
<button>Mendefinisikan sebuah tombol diklik
<caption>Membuat caption pada tabel
<center>Untuk perataan tengah terhadap teks atau gambar 
<cite>Mendefinisikan kutipan
<code>Mendefinisikan sebuah bagian dari kode komputer
<col />Mendefinisikan nilai atribut dari satu kolom atau lebih dalam sebuah tabel
<colgroup>Menentukan kelompok dari satu kolom atau lebih dalam sebuah tabel untuk performatan
<dd>Mendefinisikan deskripsi dari item dalam daftar definisi
<del>Untuk memberi garis tengah pada teks/mencoret teks
<dfn>Mendefinisikan sebuah istilah definisi
<dir>Mendefinisikan sebuah daftar direktori
<div>Mendefinisikan sebuah section dalam dokumen 
<dl>Mendefinisikan sebuah daftar definisi
<dt>Mendefinisikan istilah (item) dalam daftar definisi
<em>Membuat teks miring. Fungsi tag ini sama dengan tag <i> tetapi tag <em> yang lebih dianjurkan/ditekankan pada penggunaan untuk teks miring
<embed>Digunakan untuk memasukkan file video atau file musik
<fieldset>Untuk mengelompokkan elemen-elemen yang terkait dalam form / membuat seperti frame-box di dalam form
<font>Mendefinisikan jenis font, warna dan ukuran untuk teks
<form>Mendefinisikan sebuah form HTML untuk input form
<frame />Mendefinisikan frame dalam fremeset
<frameset>Mendefinisikan satu set frame
<h1> to <h6>Digunakan untuk menunjukkan awal dari suatu header/judul dari dokumen HTML tersebut.
<head>Digunakan untuk memberikan informasi tentang dokumen tersebut
<hr />Membuat garis horisontal
<html>Mendefinisikan root dari suatu dokumen HTML
<i>Membuat teks miring
<iframe>Mendefinisikan sebuah inline frame
<img />Berfungsi untuk menampilkan gambar pada dokumen HTML
<input />Mendefinisikan input field pada form
<ins>Membuat teks bergaris bawah
<kbd>Mendefinisikan teks yang di input dari keyboard
<label>Mendefinisikan label untuk sebuah elemen <input>
<legend>Mendefinisikan sebuah caption untuk elemen <fieldset>
<li>Digunakan untuk menampilkan informasi dalam bentuk item daftar 
<link />Mendefinisikan hubungan antara dokumen dan sumber eksternalnya
<listing>Fungsi tag ini sama dengan tag <pre> dan dianjurkan menggunakan tag <pre> karena tag <listing> tidak layak/diprotes
<map>Mendefinisikan client-side peta gambar
<marquee> Membuat teks berjalan secara vertikal atau horisontal
<menu>Mendefinisikan sebuah daftar menu
<meta />Mendefinisikan metadata tentang sebuah dokumen HTML
<nobr>Mencegah ganti baris pada teks atau gambar
<noframes>Jika browser user tidak mendukung frame
<noscript>Jika browser user tidak mendukung client-side scripts
<object>meletakkan embed sebuah objek
<ol>Mendefinisikan daftar dalam format penomoran
<optgroup>Menampilkan beberapa pilihan yang sudah dikelompokkan dalam bentuk sebuah daftar drop-down
<option>Menampilkan beberapa pilihan yang berbentuk dalam sebuah daftar drop-down
<p>Membuat sebuah paragraf
<param />Mendefinisikan sebuah parameter untuk objek
<pre>Membuat teks dengan ukuran huruf yang sama
<q>Mendefinisikan sebuah kutipan singkat
<s>Untuk memberi garis tengah pada teks/mencoret teks, fungsi tag ini sama dengan tag <del> tetapi tag <s> tidak dianjurkan sebagai gantinya menggunakan tag <del>
<samp>Mendefinisikan contoh keluaran dari program komputer
<script>Mendefinisikan client-side script
<select>Membuat daftar drop-down
<small>Memperkecil ukuran teks dari ukuran defaultnya
<span>Mendefinisikan sebuah section dalam dokumen 
<strike>Untuk memberi garis tengah pada teks/mencoret teks, fungsi tag ini sama dengan tag <del>
<strong>Membuat teks tebal, fungsi tag ini sama dengan tag <b>
<style>Mendefinisikan informasi style untuk dokumen HTML
<sub>Memberikan efek subscript pada teks
<sup>Memberikan efek superscript pada teks
<table>Membuat tabel
<tbody>Untuk mengelompokkan isi body di dalam sebuah tabel
<td>Mendefinisikan sel di dalam sebuah tabel
<textarea>Mendefinisikan sebuah kontrol input multiline
<tfoot>Untuk mengelompokkan isi footer di dalam sebuah tabel
<th>Mendefinisikan sel header di dalam  sebuah tabel
<thead>Untuk mengelompokkan isi header di dalam sebuah tabel
<title>Membuat judul untuk dokumen HTML
<tr>Membuat baris di dalam sebuah tabel
<tt>Mendefinisikan teletype text
<u>Membuat teks bergaris bawah, fungsi tag ini sama dengan tag <ins> tetapi tag <u> tidak dianjurkan untuk kategori HTML text formatting melainkan termasuk kategori HTML Style
<ul>Mendefinisikan daftar dalam format bullet
<var>Mendefinisikan sebuah variabel
<xmp>Mendefinisikan preformatted text, fungsi tag ini sama dengan tag <pre>


semoga bermanfaat teman blog dari saya :D... see you next time brother 

Kamis, 24 Mei 2018

cara membuat form sederhana php-html

Halo teman kita jumpa lagi .. kali ini kita akan membahas tentang cara membuat form sederhana
pada form kali ini saya menggunakan aplikasi xampp untuk menjalankan projek kali ini semoga berguna untuk yang baru belajar java :D


FORM 

HTML menyediakan tag <FORM>
untuk membuat form di halaman web. Form digunakan untuk menerima masukan dari pengguna, untuk selanjutnya diolah. Untuk membuat form diperlukan juga tag<INPUT> yang terletak diantara <FORM> dan <FORM>


Tag <INPUT> antara lain memiliki atribut TYPE berikkut ini pilihan atribut TYPE:
       
 TYPE                                                               Keterangan
- text                                                  Masukan berupa text.
- password                                         Masukan berapa password, terlihat karakter tentu
- checkbox                                         Masukan berupa pilihan, dan pilihan itu bisa lebih dari satu
- radio                                                Masukan berupa pilihan, dan pilihan hanya satu
- submit                                             Tombol untuk menerima seluruh masukan
- reset                                                Tombol untuk membatalkan seluruh masukan 
- file                                                  Untuk menerima masukan berupa file
- imge                                                Mirip submit, untuk masukan berupa gambar yang dapat di klik
- button                                              Membuat tombol

Untuk tag<INPUT> yang atribut TYPE-nya text memiliki atribut lainnya yaitu:
  1.  NAME menamai kotak
  2. VALUE menantai atau menampung teks
  3. SIZE  mengatur ukuran teks pada kotak
  4. MAXLENGTH menentukan panjang maksimum teks
Contoh 1
formnya sebagai berikut.
Ketikan perintah-perintah dibawah ini.!
<htm>
<head>
  <tilte>Form 1</title>
</head>
<body>
   <form>
Nama: <input type ="text"name ="teks1"><br><br>
Kelas: <input type ="text" name ="teks2" maxlength="2"> <br><br>
No: <input type ="text" name ="teks3" value="10"> <br><br>
Hobby: <input type ="text"name="teks4"size="8"> <br><br>
Password: <input type ="password" name ="teks5">
</form>
</body>
</html>

simpan file Anda dengan nama: text1.php dan coba untuk run dengan local host.


hasil nya sepeti ini!



Contoh 2
<head>
<title> Form 2 </title>
</head>
<body>
<form name="data" action="form_1.html" method="post">
Nama-nama Guruku: <br><br>
<input type="checkbox" name="c1"> Pak suprawito <br>
<input type="checkbox" name="c1" Checked> Pak Arifin <br>
<input type="checkbox" name="c1"> Pak abdi <br>
<input type="checkbox" name="c1"> Bu dina <br><br>
Pelajaran favoritku: <br><br>
<input type="radio" name="r1"> Matematika <br>
<input type="radio" name="r1" > Fisika<br>
<input type="radio" name="r1"> Kimia <br>
<input type="radio" name="r1"Checked> Sejarah <br><br>
Situs Pilihanku: <br><br>
<select name="s1">
<option> Detik.Com </option>
<option selected> Kapanlagi.Com </option>
<option> Kickandy.Com </option>
<option> Mediamasakini.Net </option>
</select> <br><br>
Silahkan tuliskan komentar Anda di bawah ini:
<br><br> <textarea name="kesan" rows="5" cols="20">
Masukkan komentar di sini !!!
</textarea> <br><br>
<input type="submit" value="kirimkan"><br>
<input type="reset" value="ulangi"><br>
</form>
</body>
</html>

simpan file Anda dengan nama: text2.php dan coba untuk run denagan localhost.


hasil dari kodingan nya seperti ini

sekian dari pembelajaran dari saya semoga bermanfaat:D.. hehehe

Rabu, 23 Mei 2018

belajar coding dengan html, Ccs dan Mysql

Halooo :D Kita sudah belajar dasar Html , Css, dan juga Mysql. Sekarang kita lanjut untuk belajar php, jika masih ada yang belum belajar html,css dan juga mysql silahkan dicari tutorial nya di web ini juga ya :D oke lanjut,  apakah kita wajib untuk belajar PHP? Ya Jelas sob, Kalau sobat ingin menjadi seorang Web Developer, belajar php adalah hal yang wajib. Meskipun untuk membuat web dengan Css dan Html saja sudah bisa, tapi jika website yang ingin kita buat berhubungan dengan database maka kita tidak bisa membuat web hanya dengan css dan html. Untuk lebih lengkap nya nanti akan saya jelaskan sob. Yuk disimak,
PHP? Apakah Pengertian dari PHP? PHP merupakan bahasa pemrograman yang dapat digunakan untuk membuat skrip yang lebih interaktif. Skrip ini kemudian akan diolah dalam web server yang hasilnya dapat dilihat dalam bentuk HTML. PHP memungkinkan untuk membuat situs yang lebih interaktif dan lebih mudah untuk dioperasikan. MySQL merupakan bahasa pemrograman database terbuka. Yang mana memungkinkan untuk bisa membuat, merubah, dan mengakses beberapa database sekaligus dalam server. Kombinasi keduanya biasanya digunakan untuk membuat berbagai macam Website.
Secara singkat nya PHP adalah server side language artinya kode PHP akan dieksekusi di server dulu baru kemudian hasilnya akan ditampilkan di layar client.
Sebelum kita lanjut mengenai PHP, sebaiknya sobat sudah belajar mengenai dasar-dasar html,css , dan mysql ya sob biar belajar PHP nya jadi lebih mudah. Untuk tipe file / ekstensi nya adalah .php contoh latihan1.php
Apa saja alat tempur yang akan kita gunakan untuk latihan PHP ini?
  • Xampp (Jika windows), Mampp (untuk macintosh), dan Lampp(untuk linux, tapi jika di linux bisa kok tanpa Lampp ini nanti deh saya share tutornya install web server tanpa Lampp), dll boleh pake Web server apa saja tapi disini saya menggunakan Xampp ya
  • Text editor ( Terserah saja apa, notepad biasa juga bisa kok tapi kalo pusing jangan salahin saya ya :v ) kalo saya menggunakan Sublime Text (yg free)
  • Web browser (bisa Chrome, Mozilla, dll)
Latihan pertama
Kita membuat Echo, echo fungsinya untuk menampilkan teks ke website. Untuk memulai koding php harus diawali dengan <?php dan diakhiri ?> , dan untuk pernyataan php diakhiri dengan ;
contoh:
<html>
<head>
 <title>Php pertamaku</title>
</head>
<body>
<h1>Belajar PHP</h1>
<?php
echo "Belajar php di cak88.com";
?>
</body>
</html>
Lalu save di dalam folder xampp -> htdocs -> buat folder baru dengan nama latihan -> masuk ke folder latihan. Lalu save dengan nama belajar.php.
Dan untuk menjalankan latihan1.php, sobat buka web browser dan ketikkan di url localhost/latihan(nama folder nya)/belajar.php (nama file php nya). Contoh gini :

Berhasil tampil! Jika gagal, pastikan Apache di xampp nya sudah di start ya sob :D Saya lupa ngasih tau :D
Menampilkan text di php kita sudah berhasil, sekarang kita coba tambah dan kurang di php. Koding nya seperti ini :

<html><head> <title>Php tambah kurang</title></head><body><h1>Belajar PHP</h1><?php/*Tambahan di php 10 ditambah 4 hasil nya? */$a = 10; // variable a kita isi dengan nilai 10$b = 4; // variable b kita isi dengan nilai 4$c = $a + $b; // disini adalah proses nyaecho "Hasil dari Tambahan $a + $b = $c"; // disini outputnyaecho "</br>"; // membuat baris baru. sudah belajar html kan? tau dong berarti.echo "=======================";echo "</br>";/*

Pengurangan di php 7 dikurang 4 hasil nya?
Save dengan nama latihan2.php, lalu sobat buka lagi url nya localhost/latihan/lbelajar2.php,
dan hasil nya seperti ini :
Selanjutnya kita mainan IF / ELSE di php, jadi permasalahan nya gini :
  • Saya mau beli es krim
  • Harga 1 bungkus es krim Rp 1000
  • Uang saya hanya Rp 9000
Gimana caranya biar si php ini ngasih tau kalo uang saya kurang dari harga es krom? Udah belajar > lebih dari, < kurang dari, = sama dengan tapi dalam php conditional statement nya == 2 buah sama dengan. Masih ada conditional statement lain nya seperti && artinya (AND) , || artinya (OR). Nanti kita kasih contoh kok.
Oke kembali ke es krim.
Jadi koding nya adalah seperti ini :

<html><head> <title>Php es krim</title></head><body><h1>Belajar PHP (IF/ELSE)</h1><?php/*Kita tambahkan variable uang dan harga es krim dulu.*/$uang = 9000;$harga = 10000;echo "Saya : Saya mau beli, uang saya cuman ada Rp.$uang Apa bisa?";if ($uang < $harga) { $kurang = $harga - $uang;  echo " <br/>Om es krim : Ga bisa! Uang anda kurang <b>Rp.$kurang</b>!";} else { echo "<br/>Om es krim : Bisa kok!";}?></body></html>

dengan nama belajar3.php, seperti biasa buka latihan3.php nya. Hasilnya :
Berhasil kan :D Yuk kita lanjut gimana kalau nilai variable uang dan harga nya kita input kan sendiri? Tanpa kita input lebih dulu di koding nya? Ya begini contoh nya(yang teliti ya) :

<html><head> <title>Php es krim cak88.com</title></head><body><h1>Belajar PHP (IF/ELSE)</h1><form method="post">Uang kita = <input type="text" name="uang" required><br>Harga es krim= <input type="text" name="harga" required><br><?php$uang=@$_POST["uang"]; // untuk mendapatkan nilai dari text field dengan name="uang" $harga=@$_POST["harga"]; // sama seperti diatas tapi "harga"if (($uang && $harga) == "") { // Jika uang DAN harga SAMA DENGAN kosong maka tampil dibawah ini. echo "<br/> Silahkan isi uang dan harga";} elseif ($uang < $harga) { // Jika uang kurang dari harga. $kurang = $harga - $uang;  echo " <br/>Uang anda kurang <b>Rp.$kurang</b>!";} else {  $lebih = $uang - $harga;  echo " <br/>Uang anda lebihan <b>Rp.$lebih</b>";}?><br><input type="submit" value="Proses"></form></body></html>

Save dengan nama belajar4.php dan silahkan dijalankan. Maka hasilnya,
Sudah bisa kan? Bisa dong! Baiklah sekian dulu belajar PHP dasar nya :D 
Nantikan tutorial selanjutnya ya, terimakasih sudah mau mampirdi blog saya :D !

macam- macam tag pada html dan fungsinya

sebagai pengguna baru apa itu tag html ,dalam hal ini tag pada html adalah untukmembuat tampilan pada WEB yang akan kita buat agar lebih men...