Membuat Warna Gradasi (Gradient) Pada Background Blog - Saat ini tampaknya semakin banyak sahabat blogger yang memakai warna gradient atau gradasi. Entah untuk warna teks, Background judul artikel, dan lainnya.Pada waktu yang kemudian Saya sudah posting Membuat Teks Berwarna (Gradasi) Hanya Dengan CSS. Untuk kesempatan kali ini Saya akan coba posting Membuat Warna Gradasi (Gradient) Pada Background Blog.
Bagi sobat blogger yang suka ngoprek dan modifikasi template, mungkin sobat ingin menciptakan templatenya penuh dengan warna yang keren dan menarik, tidak bosan di pandang. Salah satunya dengan Membuat Warna Gradasi untuk Background Blog.
Warna gradasi ini hanya memakai CSS, jadi sobat tidak perlu khawatir akan menimbulkan loading blog menjadi berat.
See Other Article
Nah, jikalau sobat ingin menciptakan warna gradasi untuk blog sobat, mari kita simak caranya berikut ini. Untuk warna gradasi ini tidak hanya untuk background judul artikel saja. Namun dapat juga kita terapkan untuk background judul yang lainya, menyerupai judul blog, judul sidebar, dan lainya.
Baca juga: Membuat Gradient Color Animasi Pada Backround Dengan CSS
Namun disini Saya hanya mengasih Contoh untuk menciptakan warna background pada judul artikel dan judul sidebar saja.
Contoh Warna gradasi untuk judul postingan.
Contoh Warna gradasi untuk judul Widget pada sidebar.
Kode di atas yaitu arahan umum, misalnya :
Baca juga: Membuat Gradient Color Animasi Pada Backround Dengan CSS
Namun disini Saya hanya mengasih Contoh untuk menciptakan warna background pada judul artikel dan judul sidebar saja.
Contoh Warna gradasi untuk judul postingan.
.post h1 {background:linear-gradient(45deg, #00626b, #00f7ca);}Contoh Warna gradasi untuk judul Widget pada sidebar.
.sidebar h2 {background:linear-gradient(45deg, #00626b, #00f7ca);}Kode di atas yaitu arahan umum, misalnya :
.post h1 {.........} ini untuk judul postingan dengan tag heading h1..post h2 {.........} ini untuk judul postingan dengan tag heading h2..sidebar h2 {...........} ini untuk judul widget dengan tag heading h2..sidebar-wrapper h3 {...........} ini untuk judul widget dengan tag heading h3.NOTE:
Kode pada tiap template berbeda-beda. Jika sobat tidak menemukan arahan menyerupai diatas, silahkan cari yang mirip, dan sesuaikan denganclass yang dipakai pada template blog sobat.
Share this Article
