14 March 2011

Membuat Tulisan Miring Stop Narkoba CSS3

Hari ini kepala terasa berat dan sakit bila digerakkan, bukan karena akibat mengkonsumsi Narkoba melainkan karena posisi tidurnya yang miring.  Terus terang sampai detik ini saya belum pernah merasakan kenikmatan semu Narkoba. Dan mudah-mudahan jangan sampai terjerumus Narkoba seperti yang sedang melanda para artis kita.

Ternyata ada hikmahnya rasa sakit di kepala ini yang maunya miring terus, yakni timbul inspirasi untuk mengabadikan peristiwa ini di catatan blogku.  Karena lagi santer-santernya berita di media massa Artis yang terjerat Narkoba makanya saya beri judul Membuat Tulisan Miring Stop Narkoba CSS3.

Nah sekarang kita mulai saja membuat tulisan miring :
Pada eksperimen ini saya menggunakan area posting blog sebagai media untuk membuatnya.  Jadi nantinya tulisan miring tersebut akan muncul di halaman posting.
Kode lengkapnya seperti ini :

<style type="text/css">
.narkoba-miring {
transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);

font-size: 120px;
text-align:center;
color: #d60204;
text-shadow: 2px 2px 2px #333;
filter: dropshadow(color=#333, offx=2, offy=2);
font-weight:bold;
font-style:italic;
font-family:georgia;}
</style>

<span class="narkoba-miring">STOP NARKOBA....!</span>

Copy paste semua kode tadi ke area posting (mode HTML bukan Compose) setelah itu terbitkan atau Publish Post.

Sekarang lihat hasilnya di halaman demo
Lihat Demo

Keterangan:
  1. Teks yang berwarna merah adalah kode untuk membuat tulisan jadi miring
  2. Dan yang berwarna biru adalah kode untuk mengatur warna, ukuran, jenis font, dan efek bayangan huruf.
  3. STOP NARKOBA....! bisa diganti dengan tulisan yang lain.
Sekian dulu tutorial ini soalnya aku mau meluruskan dulu kepalaku yang miring.

10 comments:

  1. mas cara pasang google adsense di blogger gmn?

    kok di blog mas bsa d pasang

    ReplyDelete
  2. @IkhsanHafiyudin.blogspot.com, headernya harus dibagi dua dulu, baca Tips membagi header dua kolom

    ReplyDelete
  3. maksud saya, cara daftarnya..
    saya udah daftar tapi di tolak terus, jawabannya jenis halaman saya..

    katanya harus pake .com tpi blog ini kok blogspot.com tetep bisa

    ReplyDelete
  4. @ikhsanhafiyudin.blogspot.com, oh ya sory mas kemaren saya salah baca pertanyaan anda "mas cara pasang google adsense di blogger gmn?" aku membacanya begini:"mas cara pasang google adsense di header gmn?
    sory banget mas waktu itu lagi g konsen soale kondisi badan lagi kurang vit ditambah kepala miring-miring terus.

    Tentang adsense google anda harus bikin postingan berbahasa inggris minimal 10 postingan berturut-turut, setelah itu tunggu pemberitahuan dari google paling lama 2 minggu. Masalah diterima atau tidaknya itu menjadi kewenangan google. Itu pengalaman saya mas, sekali lagi mohon maaf atas kesalahan kemaren.

    ReplyDelete
  5. wah, harus make css segala ya? gimana klw buat tulisannya make word aja, terus jadikan file jpg, kemudian di upload...(alternatif mode on..he..he..)

    ReplyDelete
  6. @Blogger Modif, betul sekali bro... namun maksud aku mau menghindari uplod gambar, jadi tanpa gambar pun kita bisa ciptakan model tulisan miring

    ReplyDelete
  7. KLo Buar gambar pake transform scale yah ... ?

    ReplyDelete
  8. @Nurul Imam, betul mas tapi dalam kali ini pembahasan kita tertuju pada text bukan image.

    ReplyDelete
  9. @rey: dulu saya buat 2 blog masing2 saya buat 15 postingan berbahasa inggris, tujuannya supaya dapat akun adsense.
    tapi 2-2ny di tolak alasannya jenis halaman tidak pakai domain .com

    ReplyDelete
  10. @ikhsanhafiyudin.blogspot.com, yang didaftarkan 1 blog saja jangan dua-duanya, terus pengaturan bahasa pada seting bahasa blog harus bahasa inggris. itu pengalaman saya mas, alasan jenis halaman tidak dipakai domain.com itu saya kurang tau, nyatanya banyak domain blogspot.com yang diaprove google tidak hanya blog saya ini.

    ReplyDelete

Note: Only a member of this blog may post a comment.