Postingan

Menampilkan postingan dengan label CSS

Jenis Font Standar Untuk Blog "Font Style"

Penggunaan jenis font pada blog sangat penting sekali karena font merupakan bagian vital yang dilihat pertama kali oleh pengunjung blog. Untuk penggunaan Karakter atau jenis font memang tidak ada aturan yang baku,namun alangkah baiknya kalau kita menggunakan font yang bisa memberikan kenyamanan membaca bagi pengunjung. Dibawah ini saya berikan contoh atau jenis font standar yang biasa digunakan pada blog ataupun website. Dengan melihat langsung jenis font anda dapat menimbang nimbang dan mimilah milah jenis font yang menurut anda cocok untuk blog anda. font-family: arial; Sample teks menggunakan font arial font-family: courier; Sample teks menggunakan font courier font-family: georgia; Sample teks menggunakan font georgia font-family: lucida grande; Sample teks menggunakan font lucida grande font-family: times; Sample teks menggunakan font times font-family: trebuchet; Sample teks menggunakan font trebuchet font-family: verdana; Sample teks menggunakan font verdana font-family: webd

Label Cloud Dengan Hover Background Ronded Corner

Gambar
Kali ini saya coba memodifikasi tampilan dari label cloud dengan menambahkan hover background ronded corner pada setiap link label cloud tersebut, secara standar label cloud ataupun link akan mengikuti pengaturan tautan link standar dari template anda. Langsung pada tutorial mengatur Label cloud dengan hover background caranya seperti berikut : Pertama tambahkan label cloud terlebih dahulu pada blog anda Tambah Gedget > Label > Cloud > Simpan . Masuk pada Edit HTML masukan kode di bawah ini pada bagian CSS atau diatas kode ]]></b:skin&gt; #Label1{ margin:0px; padding:6px } #Label1 .widget-content{ line-hight:1.4em; text-align:center; margin:0px; padding:10px } #Label1 a{ text-shadow:1px 1px 0 rgba(255,255,255,0.8); color:#000; text-decoration:none; padding:4px; } #Label1 a:hover{ padding:1px 4px; -webkit-border-radius:5px; -khtml-border-radius:5px; -moz-border-radius:5px; border-radius:5px; background:#a0a0a0; color:#fff; } Pratinjau terlebih dahulu kalau suda

Menambahkan Stroke Pada Teks "Judul Blog Dengan Stroke"

Gambar
Stroke merupakan outline (garis luar) pada teks, Stroke ini biasanya digunakan untuk memperjelas dan mempertegas dari teks, penggunaan stroke ini ternyata bisa di aplikasikan pada kode css dan bisa di pasang pada teks di blog. Untuk contoh lihat saya memasang Teks Stroke ini pada Judul Blog " H1 " bisa dilihat contohnya disni atau gambar dibawah ini :: Untuk membuat teks Stroke caranya cukup mudah, Teks Stroke ini mungkin hampir sama dengan Teks sahadow karena memang disini menggunakan Teks sahadow untuk membentuk sebuah Teks Stroke. Untuk memasang teks stroke caranya cukup mudah. Masuk pada Edit HTML cari kode h1.title { Masukan code css di bawah ini di bawah kode h1.title { color:#000000; text-shadow: -1px -1px 0 #f3f3f3, 1px -1px 0 #f3f3f3, -1px 1px 0 #f3f3f3, 1px 1px 0 #f3f3f3; Silahkan di Preview terlebih dahulu, kalau cocok silahkan di save. Silahkan di ganti warna teks dan warna stroke serta ketebalan dari stroke diatas, dengan merubah angka angka angka tersebut.

Mempercantik Tampilan Email Subscribe Dan RSS Feeds

Gambar
Mempercantik tampilan blog merupakan salah satu tips membuat pengunjung nyaman diblog atau webblog. Banyak cara dilakukan unuk mempercantik tampilan blog dari pengaturan warna template , layout dan lain lain. Salah satu cara mempercantik blog yaitu memasang Email Subscribe dan RSS Feeds, Dua subscribel ini memang sangat berguna sekali untuk pemilik blog tentunya Blogger sudah mengetahuinya. kali ini saya coba membuat Email Subscribe dan RSS Feeds dengan menggunakan image dan Horizontal Rule atau kalau dalam bahasa coding-ya "hr". Contoh di bawah ini : Email Subscribe Via Email RSS Feed Subscribe Via RSS Feed Untuk membuatnya caranya cukup mudah. Pilih Tambah Gadget >> HTML/JavaScript. Masukan kode di bawah ini. <img src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha3ViPvDTxC3zVYFBL4dxJ6KR42E0rwHOFc9m6e5PrkF5hGVAFefFrPc2fHhnEMa1hBreeDwm5bPUsmo77rSiPiK8E5p9lCSIqb_AOhBMs6mcud9OszBkjgBfGzfqQC2stwpAfSwSFQA1u/s400/email.png " alt=""

Program CSS Editor Yang Cukup Mudah Digunakan

Untuk blogger yang suka Utak - atik template atau sering bergelut dengan coding CSS untuk blog atau Webblog tentu membutuhkan fasilitas yang dapat menunjang kebutuhan anda. Diantara dengan menggunakan Program CSS Editor. Ada banyak Program CSS Editor yang digunakan oleh desainer Blog atau Desainer Website Diantaranya program Dreamwever. Dreamweaver merupakan program yang cukup terkenal bagi para desainer template karena fiturnya yang cukup lengkap. Tapi buat anda yang kurang menguasai dengan Program Dreamweaver anda bisa menggunakan pilihan Program CSS Editor yang simple dan mudah gunakan. dibawah ini ada beberapa Program CSS editor yang bisa anda jadikan pilihan untuk megolah dan mengedit Code CSS. Notepad ++ (Free version) JEdit (Free version) Stylizer (Free version) PSPad (Free version) Xyle Scope (Free version) Stylesheet Maker (Not Free) CSSEdit (Not Free) Style Studio (Not Free) Rapid CSS 2010 (Not Free) Style Master (Not Free) Program diatas merupakan CSS Editor yan