Hiện nay rất nhiều website đã hộ trợ chế độ ban đêm để thỏa mản người dùng, đáng chú ý nhất là youtube họ đã hộ trợ chế độ bạn đêm này chuyển màu sáng thành màu tối.
Cách cài đặt chế độ ban đêm cho blogspot
Đầu tiên thêm đoạn Css này vào ]]></b:skin>
.night{background:#2a3548;transition:all .3s}
.night .post-body,.night .post,.night #outer-wrapper,.night #content-wrapper,.night .blogouter-wrapper,.night #comments,.night .widget,.night .tabs-content .widget li,.night .tabs-content .widget ul,.night .tabs-menu li,.night .tabs-content,.night .ticker-wrap,.night #ticker,.night #ticker ul li h3 a,.night .breadcrumbs,.night .breadcrumbs span,.night .breadcrumbs span a,.night .widget .post-body li,.night .related-post,.night .PopularPosts ul li,.night #related_post h4,.night .authorboxwrap,.night .relhead,.night .halaman,.night .comment-note,.night .comment-note h5,.night .comment_emo_list span,.night h1.post-title,.night h2.post-title a,.night #header a,.night p.description,.night .posts-title,.night .post-info,.night .blog-pager,.night .recpost .rcp-title a,.night #blog-pager,.night .PopularPosts ul li a,.night .recomments a,.night .intro-label,.night .author_description_container h4 a,.night #wrapper{background:rgba(255,255,255,0)!important;color:rgba(255,255,255,0.85)!important}
.night img{filter: brightness(70%);}
.night #NightMode{background:#fff;color:#00a1d6;}
.night #NightMode:hover{background:#fff;color:#fc4f3f;box-shadow:0 5px 10px rgba(0,0,0,0.2)}
.night #NightMode:before{content:"\f185";font-family:FontAwesome;}
@keyframes pulse{0%{-moz-box-shadow:0 0 0 0 rgba(51,51,51,0.7);box-shadow:0 0 0 0 rgba(51,51,51,0.7)}70%{-moz-box-shadow:0 0 0 10px rgba(51,51,51,0);box-shadow:0 0 0 10px rgba(51,51,51,0)}100%{-moz-box-shadow:0 0 0 0 rgba(51,51,51,0);box-shadow:0 0 0 0 rgba(51,51,51,0)}}
#NightMode{z-index:90;position:fixed;padding:0;width:40px;height:40px;line-height:40px;bottom:80px;right:25px;overflow:hidden;background:rgba(42,53,72,0.85);color:rgba(255,255,255,0.85);font-size:25px!important;border:none;border-radius:4px;-webkit-transform: translateZ(0);transition:all .5s ease-out;box-shadow:0 3px 5px rgba(0,0,0,0.1);transition:all .3s;}
#NightMode:before{content:"\f186";font-family:FontAwesome;}
#NightMode:hover{background:rgba(42,53,72,0.5);color:rgba(255,255,255,1)}
button#NightMode{animation:pulse 1.5s infinite;box-shadow:0 0 0 rgba(51,51,51,0.7);}
Tiếp Theo Thêm Đoạn JS Này Trên </Body>
<script>$("button.iris-night").click(function () {$("body").toggleClass("night");}); </script>Đoạn cuối cùng thì các bạn thêm đoạn html này vào HTML/Javascript Nhé
<a href='#NightMode'><button class='iris-night' id='NightMode' onclick="document.getElementById('switchCheckbox').checked=!document.getElementById('switchCheckbox').checked;"></button></a>
