Halaman Utama

Jumat, 14 Januari 2011

Membuat Efek tulisan dengan kode HTML


 
Kadang kita bosen dengan lihat tampilan sebuah tulisan gitu-gitu aja mungkin ada di hati kecil  kita untuk membuat sesuatu yang berbeda dengan pada tulisan di blog atau halaman web kita....jawaban nya pasti bisa asal kita siap untuk MUMET he he he
Nah di postingan ini saya coba untuk membuat efek-efek sederhana yang mungkin bisa mempercantik tulisan ayo ga usah banyak basa basi mari kita simak kode-kode nya di bawah ini:




 

NB :Sebelum kita memulai yang perlu  Bahwa penutup kode/closing tag tergantung pada pembuka kodenya, maksudnya penutup kode dengan pembuka kode itu sama, hanya saja pada bagian penutupnya akan ada garis miring (/). Contoh: pembuka kode=<b> dan penutupnya adalah=</b>dan ini akan berlaku pada kode HTML lainnya juga.



1. Kode untuk membuat huruf tebal .

KODE NYA

<b> gallerydunia <b>

contoh : gallerydunia


2.kode untuk membuat huruf miring .
KODE NYA

<i> gallerydunia </i>


contoh : gallery <i>dunia</i>
maka hasil nya : gallery dunia

3. Membuat garis bawah huruf underline .
KODE NYA

<u>  gallerydunia </u>


contoh : <u> gallerrydunia </u>

hasil nya gallerydunia

4.Membuat baris baru 
KODE NYA

  gallery <br />dunia


contoh : gallery <br />dunia
hasil nya :
gallery
dunia


5.Membuat tulisan Rataan Tengah

KODE NYA

<center> gallerydunia </center>


6.Membuat tulisan Rataan kanan


KODE NYA

   <p align="right"> gallerydunia </p>




7.Membuat tulisan Rataan kiri 

KODE NYA

   <p align="left">gallerydunia </p>

 


8.Merubah font atau gaya teks


KODE NYA

<font face="Verdana"> gallery dunia </font>


Nb : silahkan anda rubah tulisan verdana dengan font jenis lain nya kayak arial,georgia,times dll


9.Mengatur warna teks


KODE NYA

  <font color="blue"> gallerydunia </font> 

NB : warna biru bisa anda ganti dengan warna lain nya seperti blue(biru),yellow(kuning),red (merah) atau warna lain nya atau sobat kepingin kreasi warna lain nya anda ambil aja kode warna nya klik  DISINI  anda copy salah satu kodenya terus sobat ganti kata blue dengan kode yang anda copy

 
10.Mengatur besar kecil nya tulisan



KODE NYA

  <font style="font-size:500%;"> gallerydunia </font>



NB : Ukuran 500% bisa sobat ganti sesuai dengan keinginan sobat yaa..kalo mau buat tulisan gede yang menutupin separo halaman di buat aja 10.000% hi hi hi :)


11.Membuat tulisan berkedip /Blink




KODE NYA

 <blink>gallerydunia </blink>


12.Membuat Tulisan berjalan ( marquee)




KODE NYA
  <marquee>gallerydunia </marquee>
  

NB : untuk efek tulisan marquee ini  masih banyak variasi lain nya yang akan saya bahas pada kesempatan nanti.

13.Membuat Tulisan format numbering

KODE NYA


<ol>
<li>gallery</li>
<li>dunia</li>
</ol>

contoh :

1.gallery
2.dunia

14.Membuat Tulisan format bullets

KODE NYA

 

<ul>
<li>gallery</li>
<li>dunia</li>
</ul>



contoh :
  • gallery
  • dunia

15.Membuat Tulisan stabilo



KODE NYA

 

<br /><span style="background-color:#FF99FF">gallerydunia</span><br />


16.Membuat Tulisan background warna


KODE NYA

 

<div style="background:#FFFFCC; border:1px solid #F5003D; padding:5px;">


gallerydunia 


</div>

NB :
kode #F5003D adalah kode warna background yang bisa anda dapatkan DISINIpadding adalah ukuran lebar background


17.Membuat Tulisan pelangi
 

KODE NYA

<script src='http://myscriptforme.googlecode.com/files/rainbow.js'> </script> 



Teks/tulisan link pelangi
  • Silahkan anda beralih ke Rancangan
  • Kemudian pilih Edit HTML
  • Cari kode seperti ini : </head>
  • Simpan kode di bawah ini tepat di atasnya
  • simpan templete
 
Oh ya..dari tadi kok cuma teori nya aja yang di tulis example nya kok ga..??? he he yaa..!!!kayak nya lagi malas neh,,bukan..!!! maksud  saya untuk lebih memahami dan agar mudah mengerti cara membuat efek tulisan tersebut sobat langsung di praktekin aja,kalo kita hanya COPAS kita agak sulit untuk  memahami nya begono...!!!

Nah kalo sobat sudah memahami cara membuat efek tulisan ini anda bisa mempunyai modal untuk memodifikasi semua nya dengan ide dan kreasi sobat.

contoh kode sricpt di bawah halaman web ini :




<div  style="background-color: rgb(159, 197, 232); text-align: center;color:black;">
<span style="font-style: italic;font-size:small;" ><span style="font-weight: bold;"><div style="font-family: Georgia,&quot;;&quot;;">
<blink><i style="color: red;"><b>AYO...BUAT GALLERY DUNIA HIDUP...!!!</b></i></blink>
Dengan komentar sobat...di tunggu ya cuap-cuap nya bebas deh di sini berekspresi namun tetap sopan dan jangan spam ya...!!!
<blink><b style="color: red;"><i> </i></b>
<b style="color: red;"><i>SILAHKAN DI SHARE DAN COPAS</i></b></blink>
artikel yang menurut sobat bermamfaat dan supaya kita beretika tolong ya..!!!di tulis kembali sumbernya.</div>
</span></span></div>





warna merah membuat efek blink atau berkedip
warna biru membuat efek tulisan menjadi merah.
warna aqua tulisan dasar yang di modifikasi
warna merah muda membuat efek miring

Kayak nya githu aja ya silahkan di share dan Copas jika artikel ini bermamfaat mohon saran dan kritik nya di kotak komentar.

Tidak ada komentar:

Poskan Komentar

http://jupitterpandawa.blogspot.com/

Silahkan masukan comentar anda

LinkWithin

Related Posts Plugin for WordPress, Blogger...