Karya-Reza

Mengerti Kebutuhan Pengunjung

Select Menu
  • Home
  • Seputar Dunia Blogging
  • Template Untuk Blog
  • Widget Blog
  • Dan Lainnya
    • Tukar Link !
    • Daftar Banner Yang Sudah Tukar Link
  • Error Page
Home » Widget Blogging » Memodifikasi Tampilan Tag Pre Di Blog

Friday, August 15, 2014

Memodifikasi Tampilan Tag Pre Di Blog

Reza Syahputra Rizal
7 Comments
Widget Blogging
Friday, August 15, 2014

DEMO WIDGET

  • DEMO KLIK DISINI
Memodifikasi Tampilan Tag Pre Di Blog - Mungkin Dari Sebagian Kalangan Blogger
Sudah Bosan Dengan Tampilan Tag Pre Dari Syntax Anda Mungkin Masalah Itu Bisa Diatasi
Dengan Memodifikasinya Dengan Tutorial Yang akan saya sampaikan pada kesempatan
Hari Ini Setelah Kemarin Saya Share Artikel Berjudul CARA MEMBUAT TOMBOL 3 DIMENSI DENGAN CSS

Langkah Pembuatan : 

1. Cari kode ]]></b:skin> Dalam Template Anda

2. Letakan Kode Dibawah Ini Diatas Kode Tersebut
 pre {
  background-color:#333;
  font:normal 12px/14px Monaco,Monospace;
  color:#ccc;
  padding:10px 15px;
  margin:0px 0px 10px;
  position:relative;
}

pre[rel] {
  padding-top:32px;
}

pre[rel]:before {
  content:attr(rel);
  font:bold 12px/22px Arial,Sans-Serif;
  color:white;
  background-color:#39f;
  padding:0px 10px;
  position:absolute;
  top:0px;
  right:0px;
  left:0px;
}
3. Simpan Template

Share

Like

G+

Tweet

Tweet
7 Komentar untuk "Memodifikasi Tampilan Tag Pre Di Blog"

Berkomentarlah Sesuai Isi Artikel Diatas :)

Klik Untuk Komentar
Anonymous
Balas
Anonymous August 15, 2014 at 12:30 AM
delete

keren gan,,,,mantap,,,scripnya bermanfaat,,,,

Unknown
Balas
Unknown August 15, 2014 at 12:55 AM
delete

tag pre itu artinya apa ya gan?

Unknown
Balas
Unknown August 15, 2014 at 1:11 AM
delete

wih keren gan, saya coba yah. :)

Anonymous
Balas
Anonymous August 15, 2014 at 2:19 AM
delete

keren gan :D
tapi saya sudah menerapkan tag pre yang versi standar :)
lebih elegant kalo menurut saya sih :)

Anonymous
Balas
Anonymous August 15, 2014 at 4:28 AM
delete

Cocok untuk saya yang tidak terlalu pinter CSS nih,
Bisa dicoba :)

Reza Syahputra Rizal
Balas
Reza Syahputra Rizal August 15, 2014 at 7:30 PM
delete

Ok Gan , Silahkan ^_^

Satriyo76
Balas
Satriyo76 August 16, 2014 at 1:29 AM
delete

Tag pre lumayan nih gan..buat tampilan kode html atau kode script..

Berkomentarlah Sesuai Isi Artikel Diatas :)

Newer Post Older Post Home
Subscribe to: Post Comments (Atom)

Contact Me !

  • Semua Niche

    Popular Posts

    • Membuat Navigasi Halaman Dengan Keyboard
    • Template Ramai Blogger !
    • Cara Membuat Tombol 3 Dimensi Dengan CSS
    • FND Blogger Template
    • Keren! Membuat Spoiler Dengan JavaScript
    • Fianetcakep Blogger Template Download
    • Cara Membuat Widget Sosial Media Lengkap
    • Cara Membuat Tombol Back To Top Dengan Efek Bounce Ala Kang Ismet
    • BENCLUNX RESPONSIVE BLOGGER TEMPLATE DOWNLOAD

    Berlangganan

    Dapatkan Informasi Dari Blog Karya-Reza Melalui Email

    Follow blog

    Subscribe To

    Posts
    Atom
    Posts
    Comments
    Atom
    Comments

    About Me

    Reza Syahputra Rizal
    View my complete profile

    © 2025 Karya-Reza Published By Karya-Reza powered by Blogger.com.
    All Right Reserved By Blog Dian Anarchyta.