Eyes Saver, Make Your Screen Cool

Eyes Saver, Make Your Screen Cool - Hallo friend Cara Mudah Posting Gratisan, In the article you read this time with the title Eyes Saver, Make Your Screen Cool, we have prepared well for this article you read and download the information therein. hopefully fill posts Article Blogger, Article CSS, Article CSS3, Article HTML, Article Trik dan Tips, Article Tutorial, we write this you can understand. Well, happy reading.

Title : Eyes Saver, Make Your Screen Cool
link : Eyes Saver, Make Your Screen Cool

Also Read


Eyes Saver, Make Your Screen Cool

Pada dasarnya trik ini memiliki fungsi hampir sama dengan tutorial membuat screensaver untuk blog. Jika pada trick screensaver mempunyai tujuan yakni menyembunyikan konten dan digantikan dengan tampilan lain, kesempatan sekarang AA Beben akan mencoba bagaimana cara membuat Eyes Saver! Eyes-saver adalah secuil deretan kode CSS untuk menampilkan efek redup-redup (rgba) supaya ketika menemukan web/blog dengan tampilan warna yang kontras mata kita akan terbantu terlindungi dengan mengaktifkan fitur eyes saver :D
Ilustrasi on sekrin siut:screen-saverDalam kasus ini, penanaman kode rgba(0,0,0,0.3); sebagai warna background akan membantu berfungsi sebagai filter kontras cahaya yg berlebihan (mencolok)! Singkat cerita, gue mau kasih tau bagaimana cara membuat layar monitor anda sekalian menjadi rgba(0,0,0,0.3) :))
.container_ {
transition: transform 0.5s;
backface-visibility: hidden;
}
.eyesSaver-Overlay {
display: none;
background: rgba(0,0,0,0.3);
}
.eyesSaver-Overlay,.eyesSaver-Overlay a {
position: fixed;
z-index: 99;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.button {
display: block;
float: right;
background: #fff;
padding: 5px 10px;
border-radius: 50%;
font-size: 1.3em;
transition: all 0.3s linear;
}
.button:before {
content: '\2600';
}
.button:hover {
box-shadow: 0 13px 25px 0 rgba(0,0,0,0.3);
}
nav:target ~ .container_ .eyesSaver-Overlay {
display: block;
}
.nav1 {
bottom: 5%;
right: 4%;
position: fixed;
}
Tempatkan syntax HTML di dalam tag <body> sebelum tag </body> template.<nav id="slideLeft"></nav>
<div class="container_">
<div class="eyesSaver-Overlay"><a href="#"></a></div>
<div class="nav1">
<a href="#slideLeft" class="button"></a>
</div>
</div>
DEMO
Bye :-h


Thus articles Eyes Saver, Make Your Screen Cool

that is all articles Eyes Saver, Make Your Screen Cool This time, hopefully can provide benefits to all of you. Okay, see you in another article posting.

You now read the article Eyes Saver, Make Your Screen Cool with the link address https://autopostingblogspot.blogspot.com/2015/04/eyes-saver-make-your-screen-cool.html

0 Response to "Eyes Saver, Make Your Screen Cool"

Posting Komentar