MEMBUAT DATA DIRI PADA BLOG DENGAN HTML/JAVASCRIPT

3/30/2014    3 comments


Cara membuat tabel biodata diri dengan HTML/JAVASCRIPT. Sebagai mahasiswa IT, pasti kita mendapatkan mata kuliah tentang dasar-dasar pemrograman web (web programming). Salah satunya kita akan mendapatkan pengertian mengenai dasar HTML/JAVASCRIPT. Mungkin saya atau sahabat bosan dengan beberapa data diri yang hanya dapat terlihat secara offline maupun online melalui media sosial (social media). Kali ini saya akan memberikan sedikit tips untuk membuat data diri menggunakan HTML/JAVASCRIPT, langsung saja mempraktekkan bagaimana membuat script file HTML tersebut :

  1. Copykan script yang tertera dibawah ini : 
    2. <div class="MsoNormal" style="color: #333333; font-size: 13px; line-height: 20px;">
<table class="infobox vcard" style="background-color: #f9f9f9; border: 1px solid rgb(170, 170, 170); clear: right; color: black; float: right; font-family: sans-serif; font-size: 11px; line-height: 1.5em; margin: 0.5em 0px 0.5em 1em; padding: 0.2em; width: 22em;"><tbody>
<tr><th class="fn" colspan="2" style="font-size: larger; text-align: center; vertical-align: top;"> <br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvybieEh5f3YHEpJHed2s8G0b7fCZ5BFjVjUouVVEP_P8965Jv5pNavn4O_WW7ShTCdLDTL3r6mOPeIiPcyZIhn9wx9xDMk9c03tsh1vrWpqb1AneFwrvHvsqfeVpMvYDzxIGpvyQneI8/s1600/IMG_3562.JPG" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvybieEh5f3YHEpJHed2s8G0b7fCZ5BFjVjUouVVEP_P8965Jv5pNavn4O_WW7ShTCdLDTL3r6mOPeIiPcyZIhn9wx9xDMk9c03tsh1vrWpqb1AneFwrvHvsqfeVpMvYDzxIGpvyQneI8/s320/IMG_3562.JPG" width="204" /></a></div>
</th></tr>
<tr><td colspan="2" style="text-align: center; vertical-align: top;"><br /></td></tr>
<tr><th style="vertical-align: top;" width="85">Nama lahir</th><td style="vertical-align: top;">Wahyu Agus Firmanto</td></tr>
<tr><th style="vertical-align: top;">Nama panggilan</th><td style="vertical-align: top;"><span class="nickname">Wahyu</span></td></tr>
<tr><th style="vertical-align: top;">Lahir</th><td style="vertical-align: top;"><span class="noprint">31 Agustus 1994</span><br />
<span class="flagicon"><a href="http://id.wikipedia.org/wiki/Indonesia" style="background-image: none; background-position: initial initial; background-repeat: initial initial; color: #0b0080; text-decoration: none;" title="Bendera Indonesia"><img alt="Bendera Indonesia" class="thumbborder" height="15" src="http://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Flag_of_Indonesia.svg/22px-Flag_of_Indonesia.svg.png" srcset="//upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Flag_of_Indonesia.svg/33px-Flag_of_Indonesia.svg.png 1.5x, //upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Flag_of_Indonesia.svg/44px-Flag_of_Indonesia.svg.png 2x" style="border: 1px solid rgb(221, 221, 221); vertical-align: middle;" width="22" /></a></span>&nbsp;Balikpapan, Kalimantan Timur,&nbsp;Indonesia</td></tr>
<tr><th style="vertical-align: top;">Pekerjaan</th><td style="vertical-align: top;">Pelajar</td></tr>
<tr><th style="vertical-align: top;">Tahun aktif</th><td style="vertical-align: top;">2000&nbsp;- sekarang</td></tr>
<tr><th style="vertical-align: top;">Kota sekarang</th><td style="vertical-align: top;">D.I.Y</td></tr>
<tr><th style="vertical-align: top;">Agama</th><td style="vertical-align: top;">Islam</td></tr>
<tr><th style="vertical-align: top;">Suku</th><td style="vertical-align: top;">Jawa</td></tr></tbody></table></div>
  2. Masuk ke akun blogger sahabat > Tata letak > kemudian Tambahkan Gadget >  pilih HTML/JAVASCRIPT
  3. Pastekan script yang dicopy tadi kemudian simpan

Lihat hasilnya, refresh blog


Semoga bermanfaat sahabat…

3 comments: