Sabtu, 21 Januari 2012

CSS3 Gradient Warning Line

http://cdn.tripwiremagazine.com/wp-content/uploads/2010/04/CSS3.jpg
Tutorial CSS yuk ..
udah beberapa Minggu ini saya mengisi hari saya dengan Posting Tutorial CSS, Bukan karenasaya Master, Tetapis, Saya cuma ingin share Pengetahuan CSS yang saya Kuasai.
Nah, Kali ini saya mau bagi ke kalian Cara membuat Gradient Warning Line pake CSS, Mau liat ?
Nee di bawah ini ada :

Teks kamu

Tau kan apa Maksudnya ?
kalo Gk tau, mendingan lewatin aja Tutorial ini heheheh ..
Okeh .. Kita langsung Aja ke Tutorialnya, Cekidot

1. Login Blog Masing2
2. Rancangan --> Edit HTML
3. Cari Kode ]]></b:skin>
4. Masukan Kode CSS di bawah ini di atas Kode b:skin tadi

.medeni {
  background:yellow;
  background:-webkit-repeating-linear-gradient(45deg, yellow 15px, yellow 35px, black 30px, black 60px);
  background:-moz-repeating-linear-gradient(45deg, yellow 15px, yellow 35px, black 30px, black 60px);
  background:-ms-repeating-linear-gradient(45deg, yellow 15px, yellow 35px, black 30px, black 60px);
  background:-o-repeating-linear-gradient(45deg, yellow 15px, yellow 35px, black 30px, black 60px);
  background:repeating-linear-gradient(45deg, yellow 15px, yellow 35px, black 30px, black 60px);
}
5. Simpan Template
6. Untuk Mengaktifkan Kode CSS Di atas, di butuhkan Kode HTML, Masukan Kode HTML di bawah Ini di mana aja, di postingan di widget, and Many More

<div class='medeni'>
Tulisan Loe
</div>

7. Selesai Deh Tutorialnya ..

14 komentar:

  1. weh.. kok pertamak yoo?? :D

    wkwkwk.. ngakak ane liat clss nya.. medeni wkwkwkw..
    wah nice post nih.. bacaan mingguan nich gan.. maturnuwun ngih mas.. :D

    BalasHapus
  2. wakaka ..
    Di sesuaikan karo Judul Postingane, "Danger" wakakakak .. :D

    BalasHapus
  3. makasih kk ..
    bila perlu, praktrkin ya :D

    BalasHapus
  4. Waahhh..mantef banget nih bang..amankan dulu nih...hahahyyy

    BalasHapus
  5. Wah keliatannya kerennih kk tpi mau tanya ni aman ga??????

    BalasHapus
  6. @Afterlife : Aman ..
    @Nando : wkwkw .. saya juga sob, Bila perlu Praktekin ya ehehehe .. :D =))

    BalasHapus
  7. Makasih Tutorialnya, dapat ilmu baru lagi ni :D

    BalasHapus
  8. ijin pake di blockquote ku sob.. :)

    BalasHapus