Home / Archives for October 2013

9:33 PM

   9:33 PM   No comments  

© Suriyadi.blogspot.com | Get This Widget
© Ilmu-bermanfaat23.blogspot.com author Tentang penulis Hi...saya presta bagus setiawan berasal dari indonesia.Sebagai newbie dalam dunia blogger saya merasa tertantang untuk lebih banyak belajar lagi tentang blog kalau anda ingin berlangganan artikel kami silahkan isi ya di kolom email Cara membuat kode parse HTML keren terbaru Share this article : Lihat Artikel lainnya disini Tutorial blog Cara memasukkan gambar ke postingan blog Cara mengetahui page rank blog kita Cara mengetahui jumlah artikel yang diindeks google Cara mengetahui statistik pengunjung blog kita dengan mudah Cara mengetahui skor SEO blog/web kita Cara membuat popular post dengan efek centang Cara membuat popular post V.2 dengan efek hover Membuat widget popular post menjadi seperti pelangi+nomor urut Cara mempercepat loading blog dengan jquery lazy load Cara membackup template blog dengan mudah yang kita pakai Cara merubah template blogger dengan mudah dan cepat Hati-hati untuk para pemilik blog yang berisi hal-hal berbau porno Membuat menu search keren seperti yahoo Cara membuat menu search seperti milik google Cara mencegah live link otomatis dikomentar blog Cara membuat live link di blog dan kerugianya Membuat menu social media seperti permen Membuat menu share button Shareaholic Membuat menu social media 3d keren Membuat tombol back to top and move to down di blog Membuat tombol like facebook melayang di blog dengan tombol close Membuat permalink keren di blog V.2 Membuat permalink keren V.1 Membuat menu social media seperti botol melayang Membuat menu social media seperti windows 8/dengan gaya Metro UI Label: Tutorial blog 0 komentar: Poskan Komentar previous next1 home Daftar isi Antivirus Avast Free update Februari 2013 Avast Internet Security update februari 2013 Avast Pro Update Februari 2013 Avira Antivirus Premium 2013 Avira Free Antivirus 2013 Avira Intenet security 2013 Avira System speedup 2013 ESET NOD32 ANTIVIRUS V6 ESET SMART SECURITY V6 Kaspersky Antivirus 2013 Kaspersky Internet security 2013 Microsoft Security Essential Norton 360 Norton Antivirus Norton Internet Security Bahasa Indonesia Artikel Perdagangan anak akibat facebook Artikel tentang pemilihan presiden 2014 Contoh drama Bahasa Indonesia Hikayat Bahasa Indonesia Hikayat petani Facebook Cara mengembalikan password fb yang telah dibobol Kehidupan Belajarlah dari air Susahkah Menjadi seorang Blogger? Software IDM 6.15 build 3 Media Player Classic Sweet Home 3d VLC media player Winamp Tutorial blog Apa sih backlink itu dan apa gunanya? Cara memasang TV Online keren di blog Cara memasang page rank checker keren di blog Cara memasang sitemap generator keren di blog Cara memasang website speed test di blog Cara memasukkan gambar ke postingan blog - New !! Cara membackup template blog dengan mudah yang kita pakai Cara membuat Kode warna keren diblog Cara membuat chat area di dalam postingan blog Cara membuat float share button keren Cara membuat kode parse HTML keren terbaru Cara membuat kotak scroll keren di blog Cara membuat live link di blog dan kerugianya Cara membuat menu search seperti milik google Cara membuat page navigation (number) keren Cara membuat popular post V.2 dengan efek hover - New !! Cara membuat popular post dengan efek centang - New !! Cara membuat popular post keren bergerak Cara membuat sidebar toggle hide and show Template Johny wuss Cara mempercepat loading blog dengan jquery lazy load - New !! Cara menaikkan page rank blog V.2 Cara menaikkan page rank blog V.3 Cara menaikkan page rank blog V.4 Cara menaikkan page rank blog V.5 Cara mencegah live link otomatis dikomentar blog Cara mendaftar di blogtopsite.com Cara mendaftarkan blog ke technoraty Cara mendapat backlink berkualitas Cara mengetahui jumlah artikel yang diindeks google - New !! Cara mengetahui jumlah backlink yang blog kita dapat Cara mengetahui page rank blog kita - New !! Cara mengetahui skor SEO blog/web kita - New !! Cara mengetahui statistik pengunjung blog kita dengan mudah - New !! Cara menghapus poskan komentar(atom) dan Langganan: Entri (Atom): Cara menghilangkan tulisan showing post with label di Blogger Cara menghilangkan tulisan subscribe by email di kotak komentar blog Cara mengubah tampilan nama penulis,tanggal postingan,dan label pada postingan blog Cara meningkatkan page rank blog Cara meningkatkan page rank blog V.10 Cara meningkatkan page rank blog V.11 Cara meningkatkan page rank blog V.12 Cara meningkatkan page rank blog V.13 Cara meningkatkan page rank blog V.14 Cara meningkatkan page rank blog V.6 Cara meningkatkan page rank blog V.7 Cara meningkatkan page rank blog V.8 Cara meningkatkan page rank blog V.9 Cara mensubmit blog kita ke Yahoo Cara mensubmit url blog ke bing Cara merubah template blogger dengan mudah dan cepat Cara mudah membuat Sitemap.xml Blogger dengan mudah Cara paling mudah mengetahui posisi artikel blog di google Chat Daftar isi Hal-hal yang harus diperhatikan saat menjadi seorang blogger Hal-hal yang membuat loading blog menjadi lama Hati-hati untuk para pemilik blog yang berisi hal-hal berbau porno Link exchange Macam-macam text area di blog Membuat background blog berubah saat tersentuh mouse Membuat background blog berubah-ubah Membuat breadcrumb di blogspot keren Membuat daftar isi blog keren dan otomatis dengan scroll Membuat efek hover pada header blog Membuat efek hover pada judul postingan blog Membuat efek pada popular post Membuat efek post hover keren hanya di homepage blog Membuat efek post hover keren pada postingan blog Membuat email subscribe keren Membuat email subscribe keren V.2 Membuat favicon pada blog dengan mudah dan keren Membuat halaman demo blog Membuat loading blog stylish Membuat loading page blog keren dengan mudah Membuat menu berputar keren diblog Membuat menu rocking rolling rounded dengan jquery dan valid HTML5 Membuat menu search keren Membuat menu search keren seperti yahoo Membuat menu share button Shareaholic Membuat menu share button dengan efek dari terang ke gelap di blog Membuat menu share button dengan efek naik turun di blog Membuat menu share button flip/berputar pada blog Membuat menu share button lingkaran tertekuk Membuat menu share button warna-warni Membuat menu social media 3d keren Membuat menu social media dengan efek push button Membuat menu social media keren Membuat menu social media keren V.2 Membuat menu social media keren V.3 Membuat menu social media seperti botol melayang Membuat menu social media seperti permen Membuat menu social media seperti windows 8/dengan gaya Metro UI Membuat meta tag deskripsi berbeda pada setiap postingan di blog Membuat permalink keren V.1 Membuat permalink keren di blog V.2 Membuat related post dengan efek centang Membuat share button berbentuk seperti daun Membuat threated comment seperti buku diary Membuat tombol back to top and move to down di blog Membuat tombol like facebook melayang di blog dengan tombol close Membuat widget popular post menjadi seperti pelangi+nomor urut - New !! Menambahkan pita pada komentar author di blog Mengubah privasi blog supaya dapat diakses oleh mesin telusur Tutorial windows cara mengatasi keyboard mati setelah Uninstal avast Windows Windows 7 Home Premium Windows 7 Professional Windows 7 SP1 offline download Windows Xp SP3 Professional windows 7 ultimate Widget by Ilmu-bermanfaat23 Cara berlangganan Masukkan email anda disini dan dapatkan kiriman artikel terbaru kami setiap saat: Delivered by Tetesan ilmu

Search Box Style Green

   9:30 PM   No comments  
Search Box Style Green

kode kode html

   9:22 PM   No comments  
<i>ISI TEKS KAMU</i
<big>ISI TEKS KAMU</big>
<b>ISI TEKS KAMU</b>
<s>ISI TEKS KAMU</s>
<u>ISI TEKS KAMU</u>
<li>ISI TEKS KAMU</li>
<tt>ISI TEKS KAMU</tt>
<font color="blue"size=
<style type="text/css">b
<fieldset class=important><legend><fon
<textarea rows="2"
<pre>spasi</pre>atau gunakan <br/>
<a href="http://NAMA ALAMAT URL">NAMA TEKS LINK</a>
<link rel="shortcuticon
<a href="http://ALAM
<hr color='Red' size='3'>
<img src="http://url gambar"height=
<table width="500px">
<textarea style="border:2px red dotted;background:black;color:aqua">
<div style="background:transparent url('http://URL GAMBARMU')">
jangan lupa beri kode </div> untuk mengakhiri letak background anda
<ul><li>Text 1.</li><li>Text 2.</li><li>Text 3.</li><li>Dan seterusnya</li></ul>
<li>isi teks</li>
</ul>
<ul style="list-style:square;">
<li>tes</li>
<li>contoh 1</li><li>contoh 2</li>
</ul>
<ol><li>contoh</li><li>contoh</li><li>dst</li></ol>
<img src="http://Url

Background

   8:44 PM   No comments  
Background
Dengan menggunakan latar belakang (background) maka website kita akan nampak semakin menarik. Untuk memasukkan latar belakang kita bisa menggunakan pilihan warna maupun grafik (gambar).
Sekarang kita mulai dengan menggunakan pilihan warna:



<html>
<head></head>
<body bgcolor="#FF99FF">
<p>Hai.. Saat ini saya sedang belajar membuat latar belakang dengan warna</p>
<p>Kalau anda kurang suka dengan warnanya... ganti aja deh... kode warnanya... </p>
</body>
</html>



Untuk nilai dari atribut bgcolor diatas anda bisa menggunakan Kode hexadecimal, Nilai RGB atau Nama dari warna tersebut.
Coba anda ganti nilai dari atribut bgcolor dengan contoh dibawah ini:



<body bgcolor="#FFFF00">
<body bgcolor="rgb(250,250,0)">
<body bgcolor="yellow">
Hasilnya akan sama. Untuk mengetahui Kode Hexadecimal dan Nilai RGB dari suatu warna.

Selanjutnya membuat latar belakang dengan grafik atau gambar.
Pertama anda harus punya gambar yang ber-extention .gif atau .jpg yang akan dijadikan background, masukkan (copy) gambar tersebut ke folder tempat file dokumen HTML anda berada, dan harus tahu nama dan perluasan (extention) dari file tersebut, misalkan nama filenya adalah:background.jpg



<html>
<head></head>
<body background="background.jpg">
<font color="blue"><h1 color="red">Selamat datang di Websiteku</h1></font><hr color="#ff0000" size="2">
<p><font face="Verdana" size="4" color="black">Hai.. Saat ini saya sedang belajar membuat latar belakang dengan gambar,<br>
Biar bagaimanapun anda diwajibkan harus menyukainya...</font></p>
</body>
</html>


Kemudian latar belakang dapat juga menggunakan gambar yang ada di website orang lain, tapi dengan catatan anda harus sedang terhubung ke internet (online) dan harus tahu alamat url dari gambar tersebut di internet. Untuk mengetahui alamat suatu gambar klik kanan gambar tersebut kemudian pilih properties dan lihat image location, copy alamat tersebut dan ganti ke contoh dibawah ini diawalii dari http:



<html>
<head></head>
<body background="http://i185.photobucket.com/albums/x272/akomara/HeaderLagi.jpg">
<p>Hai.. Saat ini saya sedang belajar membuat latarbelakang dengan menggunakan gambar dari website orang lain! hua ha..ha..ha..</p>
<p>Mudah-mudahan yang punya website ngamuk sekalian deh...siapa takut!!</p>
</body>
</html>

4 Cara Membuat Background Blog dengan CSS dan HTML

   8:43 PM   No comments  

4 Cara Membuat Background Blog dengan CSS dan HTML

4 Cara Membuat Background Blog dengan CSS dan HTML - Pada dasarnya setiap blogger pasti ingin membuat tampilan blognya terlihat sedikit lebih menarik. Jadi pengetahuan tentang cara memasang background pada blog memang diperlukan.

Kali ini saya akan berbagi sedikit tentang cara memasang background dengan menggunakan CSS dan HTML. Metode ini bisa jadi cukup mudah untuk dilakukan.... Tapi bagian background gradiasi nanti akan agak kompleks, jadi harap pelan-pelan saja bagi pemula....

Perlu diperhatikan bahwa  jika kita menggunakan CSS, maka kode masih harus "dipanggil" dengan memasang nama selector pada kode HTML. Tapi penggunaan CSS ini sendiri mempunyai banyak keunggulan daripada menyuntikkan style dengan HTML. Kapan-kapan kita bahas masalah ini dalam artikel tersendiri.

Jadi kita langsung saja, 4 cara membuat background pada blog adalah sebagai berikut:


CARA PERTAMA

Membuat Background pada Blog dengan warna polos

Dengan CSS
Anggap saja kita menentukan nama id pada CSS adalah mybox. Kita ingin membuat sebuah komponen dengan ukuran 500px x 300px dengan warna background merah biru muda, dan padding 10px.... maka CSS bisa ditulis seperti berikut:

#mybox {
width: 500px;  
height: 300px;
background:#48a0e8;
padding: 10px;
color: #ffffff;
}

Contoh penerapan:
<div id="mybox">ini adalah contoh dari penggunaan warna polos pada background</div>

Dengan HTML
Berbeda dengan CSS, jika menggunakan HTML maka definisi pengaturan langsung ditaruh di dalam div dengan menggunakan fungsi style, lihat contoh di bawah
<div style="width:500px; height:300px; background:#48a0e8; padding:10px; color:#ffffff">ini adalah contoh dari penggunaan warna polos pada background</div>

Cara CSS atau HTML keduanya akan terlihat seperti di bawah ini
ini adalah contoh dari penggunaan warna polos pada background


CARA KEDUA

Membuat Background Blog Dengan Gradiasi Warna

Kita tidak perlu lagi membahas pengaturan yang lainnya karena contohnya sudah ada di atas. Kali ini kita akan spesifik saja membahas pengaturan background. Langkah pertama untuk membuat background adalah menentukan ada berapa warna dalam gradiasi yang akan digunakan?
Anggap saja kita akan menggunakan 4 warna, silahkan cari 4 kode hex dari warna yang akan digunakan. Dalam contoh kali ini saya akan menggunakan gradiasi biru...

Langkah 1: Menentukan warna gradiasi
  • Warna 1: #dbebff
  • Warna 2: #6695bd
  • Warna 3: #8fc2e3
  • Warna 4: #5494cc

Langkah 2: Menentukan Arah Gradiasi
Anggap saja warna 1 adalah warna pertama, anda ingin warna pertama ini dimulai dari mana?
  • Jika dari atas maka gunakan perintah TOP
  • Jika dari kiri atas maka gunakan perintah LEFT TOP
  • Jika dari kiri maka gunakan perintah LEFT
  • Jika dari kiri bawah gunakan perintah LEFT BOTTOM
  • Jika dari bawah gunakan perintah BOTTOM
  • Jika dari kanan bawah gunakan perintah RIGHT BOTTOM
  • Jika dari kanan gunakan perintah RIGHT, dan
  • Jika dari kanan atas gunakan perintah RIGHT TOP

Langkah 3: Menentukan titik stop setiap warna
Anggap saja seperti ini....
  • warna 1 sampai 25% dari ruang
  • warna 2 dari 50% ruang
  • warna 3 dari 75% ruang, dan
  • warna 4 dari 90% ruang....

Jika sudah menentukan 3 faktor di atas maka kita bisa membuat kode dasarnya. Anggap saja kita mau membuat gradiasi horisontal dari atas, maka kodenya adalah....
top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%
Sekarang masukkan kode ini ke dalam fungsi gradiasi CSS untuk browser....
background-image: linear-gradient(kode);
background-image: -o-linear-gradient(kode);
background-image: -moz-linear-gradient(kode);
background-image: -webkit-linear-gradient(kode);
background-image: -ms-linear-gradient(kode);

background-image: -webkit-gradient(
 linear,
 left top,
 left bottom,
 color-stop(persentase dalam desimal, warna 1),
 color-stop(persentase dalam desimal, warna 2),
 color-stop(persentase dalam desimal, warna 3),
 color-stop(persentase dalam desimal, warna 4)
);
Hasilnya adalah seperti berikut:
background-image: linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%);
background-image: -o-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%);
background-image: -moz-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%);
background-image: -webkit-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%);
background-image: -ms-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%);

background-image: -webkit-gradient(
 linear,
 left top,
 left bottom,
 color-stop(0.2, #DBEBFF),
 color-stop(0.5, #6695BD),
 color-stop(0.75, #8FC2E3),
 color-stop(0.9, #5494CC)
);

Dengan CSS
SEKARANG ANDA TINGGAL MENARUH KODE DI ATAS KE DALAM BENTUK CSS SEPERTI CONTOH SEBELUMNYA ....
#mybox {
width: 480px;
height: 280px;
background-image: linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); 
background-image: -o-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); 
background-image: -moz-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); 
background-image: -webkit-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); 
background-image: -ms-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); 
background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.2, #DBEBFF), color-stop(0.5, #6695BD), color-stop(0.75, #8FC2E3), color-stop(0.9, #5494CC) );
background-image: -webkit-gradient( 
linear, 
left top, 
left bottom, 
color-stop(0.2, #DBEBFF), 
color-stop(0.5, #6695BD), 
color-stop(0.75, #8FC2E3), 
color-stop(0.9, #5494CC) );
padding: 10px;
color: #000000;
}

Fungsi di atas tinggal dipanggil sekali lagi ke dalam HTML....dengan kode
<div id="mybox">ini adalah contoh dari penggunaan warna gradiasi pada background</div> 

Dengan HTML
Kode HTML dari CSS di atas bisa terlihat seperti ini...
<div style="width:480px; height: 280px; background-image: linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); background-image: -o-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); background-image: -moz-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); background-image: -webkit-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); background-image: -ms-linear-gradient(top, #DBEBFF 20%, #6695BD 50%, #8FC2E3 75%, #5494CC 90%); background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.2, #DBEBFF), color-stop(0.5, #6695BD), color-stop(0.75, #8FC2E3), color-stop(0.9, #5494CC) );background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0.2, #DBEBFF), color-stop(0.5, #6695BD), color-stop(0.75, #8FC2E3), color-stop(0.9, #5494CC) ); padding: 10px; color: #000000;">ini adalah contoh dari penggunaan warna gradiasi pada background</div>

Tampilan akhirnya akan terlihat seperti ini:

ini adalah contoh dari penggunaan warna gradiasi pada background
Susah?
CARA KETIGA

Memasang Background dengan Gambar

Pada dasarnya gambar itu harus diupload dulu supaya nanti kita bisa mendapatkan URL dari gambar. Anda bisa mengupload gambar dengan menggunakan INSERT IMAGE saat mengetik artikel, lalu beralih dari COMPOSE ke HTML mode untuk melihat URL GAMBAR.

Jika anda sudah mempunyai URL Gambar, maka sekarang tinggal mengenal fungsi dasar background gambar. Lihat kode di bawah....
background: url(URL GAMBAR YANG TADI DIUPLOAD);
Jika gambarnya kecil dan anda menginginkan perulangan agar terlihat penuh, maka bisa menggunakan perintah repeat, contohnya:
background: url(URL GAMBAR YANG TADI DIUPLOAD) repeat;

Sekarang anggap saja saya mau memakai URL gambar http://yourdreambuilt.com/images/thm/lifestyles/blue-diamond-pattern.jpg. Berhubung gambarnya kecil, maka saya akan memakai fungsi repeat, sehingga kodenya terlihat seperti di bawah....
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI3-No-iChpg27omwCT5o85HNd-UYXl6_JVLsAy0CnOwMV29i7rrQu26nAX8gpNBVJFtRoYKCl3vlCp3ohfmWTJqJs1MpWPMWzLi8s-AQIqRVpM7T_GmM7eUKX8_egC9OpleWhGakBAQn4/s320/BluePattern.bmp) repeat;
Sekarang tinggal memasukkan kode ini ke dalam CSS atau HTML

Dengan CSS
kodenya akan terlihat seperti ini:
#mybox {
width: 460px;
height: 260px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI3-No-iChpg27omwCT5o85HNd-UYXl6_JVLsAy0CnOwMV29i7rrQu26nAX8gpNBVJFtRoYKCl3vlCp3ohfmWTJqJs1MpWPMWzLi8s-AQIqRVpM7T_GmM7eUKX8_egC9OpleWhGakBAQn4/s320/BluePattern.bmp) repeat;
padding: 10px;
color: #000000;
}
Anda tinggal memanggilnya ke dalam HTML seperti contoh berikut: 
<div id="mybox">ini adalah contoh dari penggunaan gambar pada background</div>

Dengan HTML
Kode HTML dari background gambar akan terlihat seperti ini:
<div style="width: 460px; height: 260px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI3-No-iChpg27omwCT5o85HNd-UYXl6_JVLsAy0CnOwMV29i7rrQu26nAX8gpNBVJFtRoYKCl3vlCp3ohfmWTJqJs1MpWPMWzLi8s-AQIqRVpM7T_GmM7eUKX8_egC9OpleWhGakBAQn4/s320/BluePattern.bmp) repeat; padding: 10px; color: #000000;">Ini adalah contoh dari penggunaan gambar berulang sebagai background</div>

Nanti tampilannya akan terlihat seperti di bawah ini....
Ini adalah contoh dari penggunaan gambar berulang sebagai background


CARA KEEMPAT

Memasang Background Di Blog Dengan Latar Semi Transparan

Kalau yang ini cukup mudah. Untuk membuat background ini cukup memakai kode rgba. Perhatikan contoh berikut ini:
background: rgba(0,0,0,.5)
Contoh di atas adalah kode untuk warna hitam transaparan 50%. Kode 0,0,0 adalah kode untuk warna hitam. Sedangkan kode .5 adalah kode untuk menyatakan tingkat transparan 50%. Silahkan masukkan kode di atas ke dalam CSS dan HTML

 Dengan CSS
Lihat contoh kode berikut ini:
#mybox {
width: 440px;
height: 240px;
background: rgba(0,0,0,.5);
padding: 10px;
color: #ffffff;
}
Anda tinggal memanggilnya ke dalam HTML seperti contoh berikut: 
<div id="mybox">ini adalah contoh dari penggunaan semi transparan pada background</div>
Dengan HTML
Apabila ditaruh langsung ke dalam kode HTML, maka kodenya akan terlihat seperti ini....
<div style="width: 440px; height: 240px; background: rgba(0,0,0,.5); padding: 10px; color: #ffffff;">ini adalah contoh dari penggunaan semi transparan pada background</div>
Nanti hasilnya akan terlihat seperti berikut ini:
ini adalah contoh dari penggunaan semi transparan pada background

Apakah tidak terlalu jelas bahwa ini sebuah latar semi transparan? Kalau begitu kita bisa coba dengan menaruhnya di atas latar gambar.... 
Contoh kode:
<div style="background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_pNH0hnprIvzdtiQdtpLq2bYyNRQNErTICUIXxk5Ccv44lBAhnPyNyTKFVrGYxa3V_gZX7T0LGyZ08sRlv96KikO8CGjcdp48So1ESFVGTe0P5bXNgtLF5IW4QynYLpzBe9H56GM7gbQ/s1600/contoh+background+gambar.jpg); height: 381px; padding: 30px; width: 340px;">
<div style="background: rgba(0,0,0,.5); color: white; height: 361px; padding: 10px; text-align: center; width: 320px;">
ini adalah contoh dari penggunaan semi transparan pada background
</div>
</div>
Hasilnya akan terlihat seperti di bawah ini....
ini adalah contoh dari penggunaan semi transparan pada background

Jadi inilah keempat cara untuk melakukan kustomisasi pada background, yaitu warna polos, warna gradiasi, gambar, dan warna semi transparan. Silahkan dipilih model background blog yang ingin anda buat.

kode warna html

   8:37 PM   No comments  
Cyan #00ffff
Blue #0000ff
Skyblue #abcdef
Darkcyan #008686
Cadetblue #5f9ea0
Midnightblue #191970
Mediumslateblue #7b68ee
Cornflowerblue #6495ed
Lightsteelblue #b0c4de
Lightskyblue #87cefa
Powderblue #bde0e6
Aquamarine #7fffda
Dodgerblue #1e90ff
Royalblue #4169e1
Blueviolet #8a2be2
Indigo #460082
Lavender #e6e6fa
Lightblue #add8e6
Deepskyblue #00bfff
Darkslateblue #483080
Mediumvioletred #071585
Mediumturquoise #4801cc
Mediumorchid #ba55d3
Darkturquoise #00ccd1
Paleturquoise #afeeee
Darkorchid #9932cc
Slateblue #6454cd
Aqua #00ffff
Red #ff0000
Darkred #860000
Indianred #cd5c5c
Firebrick #622222
Lightsalmon #ffa07a
Lightcoral #f08080
Maroon #800000
Crimson #dc143c
Tomato #ff6347
Salmon #fa8072
Coral #ff7f50
Pink #ffc0cb
Hotpink #ff69ba
Deeppink #ff1493
Lightpink #ffb6c1
Mistyrose #ffe4e1
Moccasin #ffe4b5
Peachpuff #ffdab9
Mintcream #f5fffa
Floralwhite #fffaf0
Oldlace #fdf5e6
Thistle #d8bfd8
White #ffffff
Linen #faf0e6
Navy #000080
Snow #fffafa
Orange #ffd000
Orangered #ff4500
Burlywood #deb887
Darkorange #ff8c00
Palevioletred #db7093
Sandybrown #f4a460
Rosybrown #bc8f8e
Brown #a52a2a
Peru #cd853f
 Gold #ffd700
Yellow #ffff00
Lightyellow #ffffe0
Yellowgreen #9acd32
Palegoldenrod #eee8aa
Goldenrod #daa520
Lime #00ff00
Green #008000
Seagreen #f4a460
Palegreen #98f698
Lightseagreen #20b2aa
Forestgreen #228622
Lightgreen #90ee90
Olive #808000
Tan #d2b48c
Teal #008080
Olivedrab #6b8e23
Greenyellow #adff2f
Darkslategray #2f4f45
Darkolivegreen #55662f
Mediumspringgreen #00fa9a
Darkgoldenrod #688606
Darkkhaki #606766
Orchid #da70d6
Fuchsia #ff00ff
Darkmagenta #860086
Darkviolet #940003
Mediumpurple #9370db
Violet #ee82ee
Purple #800080
Plum #dda0dd
Gray #808080
Dimgray #696969
Gainsboro #dcdcdc
Lightslategray #778899
Lightgray #d3d3d3
Slategray #708090
Darkgray #a9a9a9
Silver #c0c0c0
Springgreen #00ff7f
Lightpink #ffb6c1
Navojowhite #ffdead
Darksalmon
Khaki #f0e68c
Aquamarine
Chocolate #d2691e
Chartreuse
Limegreen
Slateblue
Saddlebrow
Aliceblue
Wheat
Bisque
Sienna

8-HTML FRAME

   8:33 PM   No comments  
compteacher.jpg:: 8-HTML FRAME ::
OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element frame untuk menampilkan informasi dalam bentuk subwindows.
MATERI:
Element FRAMESET, Element FRAME, Element NOFRAMES


ELEMENT FRAMESET
Element FRAMESET berfungsi untuk membagi isi jendela web browser menjadi beberapa bagian. Element ini mempunyai attribute yaitu cols (membagi jendela berdasarkan kolom), rows (membagi jendela berdasarkan baris), border , bordercolor, frameborder (untuk menampilkan border frame), dan framespacing (spasi antara frame). Element FRAMESET terletak di antara element HEAD dan BODY.

Sintaks:
<frameset
     cols="list"
     rows="list"
     border="pixel"
     bordercolor="color"
     frameborder="yes"|"no"
     framespacing="pixel">
   ...........................
</frameset>


ELEMENT FRAME
Element FRAME mendefinisikan frame yang terdapat dalam frameset. Element ini mempunyai attribute yaitu name (nama frame), marginheight, marginwidth, bordercolor, frameborder, noresize, scrolling, src (dokumen yang ditampilkan pada frame). Element ini tidak mempunyai tag penutup.

Sintaks:
<frame
     name="name"
     marginheight="pixel"
     maginwidth="pixel"
     bordercolor="color"
     frameborder="yes"|"no"
     noresize
     scrolling="yes"|"no"
     src="uri">


ELEMENT NOFRAMES
Element NOFRAME mendefinisikan isi yang akan ditampilkan jika suatu frame tidak dapat diakses .

Sintaks:
<noframes>
.....................
</noframes>






LATIHAN
Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.


Latihan 1:
Bagilah jendela menjadi dua frame secara vertikal dengan komposisi 40% untuk dokumen left.html dan 60% untuk dokumen right.html.


Nama file: latihan8_1.html
<html>
<head>
<title>Latihan8-1</title>
</head>
<frameset cols="40%,60%">
<frame src="left.html">
<frame src="right.html">
</frameset>
<body>
</body>
</html>
Catatan: penulisan nilai attribute cols dapat juga ditulis cols="40%,*".


Latihan 2:
Dari latihan 1 ubahlah dengan memberikan warna merah pada border dengan ukuran 10pixel.

   
Nama file: latihan8_2.html
<html>
<head>
<title>Latihan8-2</title>
</head>
<frameset cols="40%,*" border="10" bordercolor="red">
<frame src="left.html">
<frame src="right.html">
</frameset>
<body>
</body>
</html>


Latihan 3:
Dari latihan 2, tambahkan pada frame dokumen right.html dengan margin 50pixel.

   
Nama file: latihan8_3.html
<html>
<head>
<title>Latihan8-3</title>
</head>
<frameset cols="40%,*" border="10" bordercolor="red">
<frame src="left.html">
<frame src="right.html" marginheight="50" marginwidth="50">
</frameset>
<body>
</body>
</html>

7-HTML FORM

   8:33 PM   No comments  
compteacher.jpg:: 7-HTML FORM ::
OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pembuatan form.
MATERI:
Element FORM, Element INPUT, Element SELECT, Element OPTION, Element TEXTAREA


ELEMENT FORM
Element FORM berfungsi untuk mendefinisikan form interaktif. Element ini mempunyai attribute yaitu action, dan method. Attribute action berisikan aksi terhadap form yang dikirim (URI) dan attribute method berisikan metode form melakukan proses pengiriman(GET/POST).

Sintaks:
<form action="action" method="GET"|"POST">
   ...........................
</form>



ELEMENT INPUT
Element INPUT berfungsi untuk mendefinisikan input yang akan dimasukkan pengguna. Element ini mempunyai attribute yaitu name, size, type, value, checked.
Attribute name mendefinisikan nama dari input kontrol form, attribute size mendefinisikan ukuran teks pada input kontrol, type mendefinisikan bentuk-bentuk input kontrol, value mendefinisikan nilai awal/reset/submit, checked mendefinisikan pilihan terpilih pada type radio/checkbox. Element ini tidak mempunyai tag penutup dan harus berada di dalam element FORM.

Sintaks:
<input
          name="name"
          size="number"
          type="text"|"checkbox"|"radio"|"submit"|"reset"
          value="value"
          checked >


ELEMENT SELECT
Element SELECT berfungsi untuk mendefinisikan opsi pilihan pada form kontrol. Element ini mempunyai attribute yaitu name, size, multiple(diizinkan banyak pilihan). Element ini harus berada di dalam element FORM.

Sintaks:
<select
          name="name"
          size="number"
          multiple >
.....................
</select>


ELEMENT OPTION
Element OPTION mendefinisikan opsi pilihan pada menu SELECT. Element ini mempunyai attribute selected, dan value. Attribute selected opsi terpilih dan attribute value berisikan nilai element OPTION. 

Sintaks:
<option
          selected
          value="number" >
.....................
</option>



ELEMENT TEXTAREA
Element TEXTAREA berfungsi sebagai input kontrol form untuk memasukkan teks lebih dari satu baris. Element ini mempunyai attribute yaitu name, cols, rows. Attribute name mendefinisikan nama input kontrol form element textarea, attribute cols mendefinisikan jumlah kolom textarea yang terlihat, dan attribute rows mendefinisikan jumlah baris textarea yang terlihat. Element ini harus berada di dalam element FORM

Sintaks:
<textarea
          name="name"
          cols="number"
          rows="number" >
.....................
</textarea>




LATIHAN
Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.


Latihan 1:
Buat form dengan input kontrol form seperti text, checkbox, radio, reset, submit, seperti tampilan di bawah ini:

form1
                         


Nama file: latihan7_1.html
<html>
<head>
<title>Latihan7-1</title>
</head>
<body>
<FORM METHOD="POST" ACTION="mailto:teknisi@jardiknas.org">
   <H4>FORM</H4>
   <INPUT TYPE="text" NAME="var1" SIZE="30" VALUE="Enter your name here.">
   <BR><BR>
   <B>Are you a student?</B>
   <INPUT TYPE="checkbox" NAME="var2">
   <BR><BR>
   <B>How old are you?</B>
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r1">10 - 15
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r2">16 - 20
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r3">21 - 25
   <BR><BR>
   <INPUT TYPE="submit" NAME="var4" VALUE="Send">
   <INPUT TYPE="reset" NAME="var5" VALUE="Clear">
</FORM>
</body>
</html>
Jika diisi namanya adalah Rahmat ; student di check ; umur 21-25 ; maka jika form ini di submit data form yang terkirim adalah var1="Rahmat"&var2="1"&var3="r3"


Latihan 2:
Dari latihan 1 tambahkan menu select seperti gambar di bawah ini:

form2


   
Nama file: latihan7_2.html
<html>
<head>
<title>Latihan7-2</title>
</head>
<body>
<FORM METHOD="POST" ACTION="mailto:teknisi@jardiknas.org">
   <H4>FORM</H4>
   <INPUT TYPE="text" NAME="var1" SIZE="30" VALUE="Enter your name here.">
   <BR><BR>
   <B>Are you a student?</B>
   <INPUT TYPE="checkbox" NAME="var2">
   <BR><BR>
   <B>How old are you?</B>
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r1">10 - 15
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r2">16 - 20
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r3">21 - 25
   <BR><BR>
   <B>Where are you from?</B>
   <BR>
   <SELECT NAME="var6" SIZE="1">
      <OPTION VALUE="BG">Bulgaria
      <OPTION VALUE="UK">United Kingdom
      <OPTION VALUE="USA" SELECTED>USA
   </SELECT>
   <BR><BR>
   <INPUT TYPE="submit" NAME="var4" VALUE="Send">
   <INPUT TYPE="reset" NAME="var5" VALUE="Clear">
</FORM>
</body>
</html>



Latihan 3:
Dari latihan 2 tambahkan textarea seperti gambar di bawah ini:

form3


   
Nama file: latihan7_2.html
<html>
<head>
<title>Latihan7-2</title>
</head>
<body>
<FORM METHOD="POST" ACTION="mailto:teknisi@jardiknas.org">
   <H4>FORM</H4>
   <INPUT TYPE="text" NAME="var1" SIZE="30" VALUE="Enter your name here.">
   <BR><BR>
   <B>Are you a student?</B>
   <INPUT TYPE="checkbox" NAME="var2">
   <BR><BR>
   <B>How old are you?</B>
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r1">10 - 15
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r2">16 - 20
   <BR>
   <INPUT TYPE="radio" NAME="var3" VALUE="r3">21 - 25
   <BR><BR>
   <B>Where are you from?</B>
   <BR>
   <SELECT NAME="var6" SIZE="1">
      <OPTION VALUE="BG">Bulgaria
      <OPTION VALUE="UK">United Kingdom
      <OPTION VALUE="USA" SELECTED>USA
   </SELECT>
   <BR><BR>
   <B>Your comment:</B>
   <BR>
   <TEXTAREA NAME="var7" COLS="30" ROWS="6">
   </TEXTAREA>
   <BR><BR>
   <INPUT TYPE="submit" NAME="var4" VALUE="Send">
   <INPUT TYPE="reset" NAME="var5" VALUE="Clear">
</FORM>
</body>
</html>

Catatan:
Pemberian nilai attribute action pada element FORM dengan menuju ke alamat email adalah untuk memperlihatkan nilai-nilai data form yang dikirimkan.

6-HTML HYPERLINK

   8:31 PM   No comments  
compteacher.jpg:: 6-HTML HYPERLINK ::
OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk menghubungkan ke internal atau eksternal halaman web.
MATERI:
Element A


ELEMENT A
Element A befungsi untuk menghubungkan ke internal ataupun eksternal halaman web. Element ini mempunyai attribute href, name, dan target.  Attribute href berfungsi sebagai hypertext reference yang mempunyai nilai URI (uniform resource identifier) yang akan menghubungkan ke eksternal halaman web. Attribute name berfungsi untuk menghubungkan ke tempat tujuan dalam halaman web (anchor). Attribute target berfungsi untuk menampilkan halaman web pada suatu jendela frame atau jendela baru.

Sintaks:
<a href="uri" name="name" target="_blank"|"parent"|"_top"|"_self">
   ...........................
</a>




LATIHAN
Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.


Latihan 1:
Membuat link eksternal:

Link:

   1. yahoo
   2. google
   3. d3tkj
                         

Nama file: latihan6_1.html
<html>
<head>
<title>Latihan6-1</title>
</head>
<body>
Link:
<ol>
<li><a href="http://www.yahoo.com">yahoo</a></li>
<li><a href="http://www.google.com">google</a></li>
<li><a href="http://teknisi.jardiknas.org">d3tkj</a></li>
</ol>
</body>
</html>

Tugas tambahan:
Tambahkan setiap link dengan target "_blank", "_parent", "_self", "_top". Amatilah hasilnya.


Latihan 2:
Membuat link internal dan anchor:

Link internal dan anchor adalah link yang menunjuk ketempat yang ada dalam dokument ini.
kebagian akhir
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.

Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.

Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.

Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.

Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.

Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
kebagian pertama                        

Nama file: latihan6_2.html
<html>
<head>
<title>Latihan6-2</title>
</head>
<body>
Link internal dan anchor adalah link yang menunjuk ketempat yang ada dalam dokument ini.<br>
<a href="#akhir">kebagian akhir</a>
<a name="pertama"></a>
<p>Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini.
Ini adalah teks bagian pertama dalam dokumen ini. </p>

<p>Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.
Ini adalah teks bagian kedua dalam dokumen ini.</p>

<p>Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.
Ini adalah teks bagian ketiga dalam dokumen ini.</p>

<p>Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.</p>

<p>Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.
Ini adalah teks bagian kelima dalam dokumen ini.</p>

<a name="akhir"></a>
<p>Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.</p>

<a href="#pertama">kebagian pertama</a>
</body>
</html>

Tugas tambahan:
Buatlah link ke bagian ketiga dari posisi bagian keenam

5-HTML IMAGE (GAMBAR)

   8:30 PM   No comments  
compteacher.jpg:: 5-HTML IMAGE (GAMBAR) ::
OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk menampilkan gambar.
MATERI:
Element IMG (Image)


ELEMENT IMG
Element IMG befungsi untuk menampilkan gambar. Element ini tidak mempunyai tag penutup dan mempunyai attribute yaitu align, alt (teks alternatif jika gambar tidak tampil), border, height, width, hspace (jarak kosong posisi horizontal, vspace (jarak kosong posisi vertikal), src (lokasi dari gambar itu disimpan beserta nama file-nya).

Sintaks:
<img
   align="left"|"right"|"top"|"middle"|"bottom"
   alt="text"
   border="pixel"
   width="pixel"|"%"
   height="pixel"|"%"
   hspace="pixel"
   vspace="pixel"
   src="uri">




LATIHAN
Gunakan teks editor misalkan "Notepad" untuk menyunting dan menyimpan script latihan di bawah ini. Untuk melihat hasilnya bukalah file tersebut dengan menggunakan web browser atau gunakan editor yang telah tersedia pada modul ini dengan mengklik menu Editor.


Latihan 1:
Tampilkan gambar image027.jpg dengan ukuran width dan height 160pixel dan border 8pixel :
                         

Nama file: latihan5_1.html
<html>
<head>
<title>Latihan5-1</title>
</head>
<body>
<img width="160" height="160" src="image027.jpg">
</body>
</html>

Tugas tambahan:
Letakkan gambar tersebut ke kanan, setelah itu ke kiri.


Latihan 2:
Dari Latihan 1 ubah gambar menjadi yang terdapat dalam direktori /images dengan nama image050.jpg
                        

Nama file: latihan5_2.html
<html>
<head>
<title>Latihan5-1</title>
</head>
<body>
<img width="160" height="160" src="./images/image050.jpg">
</body>
</html>



Latihan 3:
Tampilkan gambar image027.jpg dengan ukuran width dan height 80pixel dan border 8pixel serta teks seperti di bawah ini:
image027.jpgKehadiran Web Teknisi Jardiknas dapat memudahkan penyebaran informasi antara Biro Perencanaan dan Kerja Sama Luar Negeri - dan anggota Teknisi Jardiknas. Keuntungan bila sistem jaringan informasi ini terbentuk, komunikasi antar Biro Perencanaan dan Kerja Sama Luar Negeri dan Provider dan anggota Teknisi Jardiknas akan lebih cepat terjalin, informasi dapat dengan cepat sampai dan tepat sasaran pula. Salam Pendidikan...! Dr. Ir. Gatot Hari Priowirjanto


Nama file: latihan5_3.html
<html>
<head>
<title>Latihan5-3</title>
</head>
<body>
<img width="80" height="80" src="image027.jpg" align="left" border="8">
Kehadiran Web Teknisi Jardiknas dapat memudahkan penyebaran informasi antara Biro Perencanaan dan Kerja Sama Luar Negeri - dan anggota Teknisi Jardiknas. Keuntungan bila sistem jaringan informasi ini terbentuk, komunikasi antar Biro Perencanaan dan Kerja Sama Luar Negeri dan Provider dan anggota Teknisi Jardiknas akan lebih cepat terjalin, informasi dapat dengan cepat sampai dan tepat sasaran pula. Salam Pendidikan...! Dr. Ir. Gatot Hari Priowirjanto
</body>
</html>