Menciptakan Dampak Blur Pada Halaman Blog Dengan Css Gradient - Dewa Blogger

Halaman

    Social Items

Buy Now
 Modifikasi ini memang merupakan sesuatu yang sangat sederhana Menciptakan Efek Blur pada Halaman Blog dengan CSS Gradient

Modifikasi ini memang merupakan sesuatu yang sangat sederhana, namun Saya rasa cukup efektif untuk membuat imbas halaman blog yang artistik. Saya menggunakan metode CSS Pseudo-Element :before untuk membuat elemen palsu yang tampak sebagai sebuah layer gradient di sebelah bawah layar. Cara ini tentunya lebih mudah kalau dibandingkan membuat elemen dengan meyertakan tag <div> atau <span> di dalam template:


Caranya sangat sederhana. Cukup salin aba-aba CSS di bawah ini lalu letakkan sempurna di atas aba-aba ]]></b:skin> atau </style>:

html:before {   content:'';   position:fixed;   z-index:5;   bottom:0;   width:100%;   height:100px;   background:transparent;   background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, #000000)); /* Chrome,Safari4+ */   background:-webkit-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* Chrome10+,Safari5.1+ */   background:-moz-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* FF3.6+ */   background:-ms-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* Opera11.10+ */   background:-o-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* IE10+ */   filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='#000000', GradientType=0); /* IE6-9 */   background:linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* W3C */ }


Samakan semua aba-aba warna yang Saya beri warna merah dengan dominasi warna latar belakang blogmu. Di sini Saya menggunakan blog dengan warna latar belakang hitam, oleh alasannya itu Saya menggunakan warna #000000 sebagai warna gradient akhir. Jika blogmu memiliki latar belakang putih, ganti semua aba-aba #000000 dengan #ffffff. Namun, kalau latar belakang blogmu berwarna selain putih dan hitam, caranya jadi sedikit lebih rumit.
Umumnya, warna lebih banyak didominasi dalam sebuah template sanggup ditemukan dalam selektor body {} menyerupai ini:

body {
...
...
background: #123456;
...
...
...
...
}


Nah, kau sanggup menggunakan aba-aba tersebut untuk menggantikan warna #000000.
Selesai!
Sumber https://www.dte.web.id/

Menciptakan Dampak Blur Pada Halaman Blog Dengan Css Gradient

 Modifikasi ini memang merupakan sesuatu yang sangat sederhana Menciptakan Efek Blur pada Halaman Blog dengan CSS Gradient

Modifikasi ini memang merupakan sesuatu yang sangat sederhana, namun Saya rasa cukup efektif untuk membuat imbas halaman blog yang artistik. Saya menggunakan metode CSS Pseudo-Element :before untuk membuat elemen palsu yang tampak sebagai sebuah layer gradient di sebelah bawah layar. Cara ini tentunya lebih mudah kalau dibandingkan membuat elemen dengan meyertakan tag <div> atau <span> di dalam template:


Caranya sangat sederhana. Cukup salin aba-aba CSS di bawah ini lalu letakkan sempurna di atas aba-aba ]]></b:skin> atau </style>:

html:before {   content:'';   position:fixed;   z-index:5;   bottom:0;   width:100%;   height:100px;   background:transparent;   background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, #000000)); /* Chrome,Safari4+ */   background:-webkit-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* Chrome10+,Safari5.1+ */   background:-moz-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* FF3.6+ */   background:-ms-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* Opera11.10+ */   background:-o-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* IE10+ */   filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='transparent', endColorstr='#000000', GradientType=0); /* IE6-9 */   background:linear-gradient(top, rgba(0,0,0,0) 0%, #000000 100%); /* W3C */ }


Samakan semua aba-aba warna yang Saya beri warna merah dengan dominasi warna latar belakang blogmu. Di sini Saya menggunakan blog dengan warna latar belakang hitam, oleh alasannya itu Saya menggunakan warna #000000 sebagai warna gradient akhir. Jika blogmu memiliki latar belakang putih, ganti semua aba-aba #000000 dengan #ffffff. Namun, kalau latar belakang blogmu berwarna selain putih dan hitam, caranya jadi sedikit lebih rumit.
Umumnya, warna lebih banyak didominasi dalam sebuah template sanggup ditemukan dalam selektor body {} menyerupai ini:

body {
...
...
background: #123456;
...
...
...
...
}


Nah, kau sanggup menggunakan aba-aba tersebut untuk menggantikan warna #000000.
Selesai!
Sumber https://www.dte.web.id/