Jumat, 10 Mei 2013

CSS : Link

CSS : Modifikasi Link Web Page


Yupzz sekarang kita modifikasi link Web Page, Ok langsung aja praktek daripada diem aja…

<html>
<head>
<style type="text/css">
a.b:link {color:green;}
a.b:visited {color:brown;}
a.b:hover {color:red;}

a.c:link {color:green;}
a.c:visited {color:brown;}
a.c:hover {font-size:150%;}

a.d:link {color:green;}
a.d:visited {color:brown;}
a.d:hover {background:black;}

a.e:link {color:green;}
a.e:visited {color:brown;}
a.e:hover {font-family:monospace;}

a.f:link {color:green;text-decoration:none;}
a.f:visited {color:brown;text-decoration:none;}
a.f:hover {text-decoration:underline;}
</style>
</head>

<body>
<p>Arahkan Pointer pada link</p>

<p><b><a class="b" href="#">Jika anda mengarahkan pointer pada link ini maka akan berubah warna</a></b></p>
<p><b><a class="c" href="#" target="_blank">Jika anda mengarahkan pointer pada link ini maka ukuran link ini akan berubah</a></b></p>
<p><b><a class="d" href="#">Jika anda mengarahkan pointer pada link ini maka background link ini akan berubah</a></b></p>
<p><b><a class="e" href="#" target="_blank">Jika anda mengarahkan pointer pada link ini maka jenis huruf ini akan berubah</a></b></p>
<p><b><a class="f" href="#">Jika anda mengarahkan pointer pada link ini maka dekorasi textnya akan berubah</a></b></p>

</body>
</html>

Maka hasilnya akan seperti dibawah ini :

Arahkan Pointer pada link
Jika anda mengarahkan pointer pada link ini maka akan berubah warna
Jika anda mengarahkan pointer pada link ini maka ukuran link ini akan berubah
Jika anda mengarahkan pointer pada link ini maka background link ini akan berubah
Jika anda mengarahkan pointer pada link ini maka jenis huruf ini akan berubah
Jika anda mengarahkan pointer pada link ini maka dekorasi textnya akan berubah

Ket : syntax target = “_blank” merupakan syntax untuk membuka tab baru pada Web Browser
Sekian ilmu dari saya, silahkan otak – atik sesuka anda 

Simpan dengan link.html

 

CSS : Table

CSS : Table Style
                                                                              
Anda tau CSS, yap betul CSS singkatan dari Cascading Style Sheet yang merupakan syntax untuk mempercantik Web Page, syntax dari CSS ini jelas berbeda dari syntax HTML, PHP, dank ode – kode Web lainnya, syntax ini tidak terlalu rumit. Nah sekarang saya akan memberikan ilmu tentang CSS, disini saya akan memodifikasi table yang dibuat dengan kode HTML dan akan saya tambahkan dengan menggunakan kode CSS. Apa yang terjadi…???? Kita lihat saja kode dibawah ini, anda tidak perlu mengetik ulang kode tersebut, tinggal copas aja.

<html>
<head>
<title>Table Style : Muhammad Anwari</title>
<style type="text/css">
#customers
{
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
width:100%;
border-collapse:collapse;
}
#customers td, #customers th
{
font-size:1em;
border:1px solid #98bf21;
padding:3px 7px 2px 7px;
}
#customers th
{
font-size:1.1em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color:#A7C942;
color:#ffffff;
}
#customers tr.alt td
{
color:#000000;
background-color:#EAF2D3;
}
</style>
</head>

<body>
<table id="customers">
<tr>
  <th>No</th>
  <th>Nama</th>
  <th>Alamat</th>
</tr>

<tr>
<td>1</td>
<td>Ubuntu</td>
<td>Afrika</td>
</tr>

<tr class="alt">
<td>2</td>
<td>Fedora</td>
<td>Sweden</td>
</tr>

<tr>
<td>3</td>
<td>OpenSuse</td>
<td>Germany</td>
</tr>

<tr class="alt">
<td>4</td>
<td>Mandriva</td>
<td>Austria</td>
</tr>

<tr>
<td>5</td>
<td>ArchLinux</td>
<td>New Zealand</td>
</tr>

<tr class="alt">
<td>6</td>
<td>Backtrack</td>
<td>Canada</td>
</tr>

<tr>
<td>7</td>
<td>Gento</td>
<td>Japan</td>
</tr>

<tr class="alt">
<td>8</td>
<td>Centos</td>
<td>Italy</td>
</tr>

<tr>
<td>9</td>
<td>Mint</td>
<td>Rusia</td>
</tr>
</table>
</body>
</html>

Simpan dengan table.html

Anda bias mengotak – atik syntax tersebut, terserah mau anda buat apa aja.. yang penting ilmu ini bermanfaat untuk anda  ;)

JAVA SCRIPT : Klik Me!

JAVA SCRIPT : Klik Me


Nah..pada materi ini anda akan menerima ilmu tentang Java Script, ‘maaf saya tidak membahas apa itu Java Script, karena terlalu panjang jadi silahkan anda pelajari apa itu Java Script disini
Pada kali Java Script yang saya bahas adalah mengenai klik mengklik J, kita akan bermain button pada Web Page kita. Coba anda lihat gambar dibawah ini, seperti inilah materi yang kita bahas kali ini.
Java Script yang kita bahas ini tampilannya seperti gambar dibawah ini.


Yupzzz langsung praktek atau bagi anda yang mau copazzzz silahkan, tidak dipungut biaya sepeserpun..

<html>
<head>
<title>Klik! -> Muhammad Anwari</title>

<script type="text/javascript">
function displaymessage()
{
alert("Semoga ilmunya bermanfaat");
}
</script>

</head>

<body>
<form>
<input type="button" value="Klik saya !" onclick="displaymessage()" />
</form>

<p>Setelah mengklik tombol tersebut akan muncul pesan, silahkan klik jika anda tidak percaya :)</p>

</body>
</html>

Maka hasilnya :
Klik! -> Muhammad Anwari

Setelah mengklik tombol tersebut akan muncul pesan, silahkan klik jika anda tidak percaya :)

 




Simpan dengan klik.html

Senin, 06 Mei 2013

Video Karate Kata

Kata dalam Karate adalah merupakan rangkaian gerakan kihon yang digabungkan sehingga membentuk keindahan gerakan sehingga bermakna filosofi yang mendalam. Sedangkan kihon itu sendiri adalah gerakan dasar yang meliputi dari tangkisan, pukulan, tendangan, dan bantingan.
 
Berikut ini adalah video kata dari karate aliran Shotokan yang diperagakan oleh Hirokazu Kanazawa

KATA HEIAN SHODAN

KATA HEIAN NIDAN

KATA HEIAN SANDAN

KATA HEIAN YONDAN

KATA HEIAN GODAN
Download 

KATA JION

KATA ENPI

KATA KANKU DAI
Download

KATA KANKU SHO

KATA UNSU

KATA SOCHIN
Download 

KATA TEKKI SHODAN

KATA TEKKI NIDAN 

KATA TEKKI SANDAN

KATA WANKAN
 
Download

KATA NIJUSHIHO
Download 

KATA MEIKYO
Download 

KATA BASSAI DAI

KATA BASSAI SHO
Download 

KATA GANKAKU

KATA CHINTE