正面:
<div class="h1 xcolor xleft">
<span class="ximg"><img src="_space.png" height="24" width="24" /></span>
{{^Tags}}问题{{/Tags}}
{{#Tags}}{{Tags}}{{/Tags}}
<span id="time">
</span>
</div>
<div class="h2 xleft">{{问题}}</div>
格式刷
/* ----------调用字体---------- */
@font-face { font-family: yh; src: url('_FZYHJW.ttf'); }
@font-face { font-family: times; src: url('_times.ttf'); }
/* ----------各种样式---------- */
body { background-color: #fff; color: black; }
.card {
font: 20px/30px yh;
background-color:#fff;
#background-image: url(_bg.png);
#background-size:100%;
}
.h1 { font: 22px/22px yh; padding: 0.3em 0em 0.3em 0.5em; }
.h2 { font: 20px/30px yh; padding: 0.3em 0em 0.3em 0.5em; }
.xleft { border-left: 3px solid #ec6c4f; }
.yleft { border-left: 3px solid #338eca; }
.zleft { border-left: 3px solid #4c991b; }
.xcolor { color: #ec6c4f; }
.ycolor { color: #338eca; }
.zcolor { color: #4c991b; }
.ximg { background: url(_x-day.svg); background-size: 100%; background-repeat: no-repeat; background-position: center; }
.yimg { background: url(_y-day.svg); background-size: 100%; background-repeat: no-repeat; background-position: center; }
.zimg { background: url(_z-day.svg); background-size: 100%; background-repeat: no-repeat; background-position: center; }
.hint { color: #333; }
/* ---------- 其他调整 ---------- */
a { color: #666; }
img { max-width: 100%; vertical-align: middle; }
.chrome img { max-width: 100%; vertical-align: middle; }
ul,ol { margin-top: 0em; }
li { margin-left: -0.5em; }
i { font-family: palatino; padding: 0 3px 0 0; }
u { text-decoration: none; background-color: #ffff75; border-bottom: 2px solid #ec6c4f; }
hr { height: 1px; width: 100%; display: block; border: 0px solid #fff; vertical-align: middle; margin:5px 0px 10px 0px; background-color: #ccc;}
#time { font-family: yh; float: right; }
/* ----------夜间模式(Android)---------- */
body.night_mode { background-color: #232323; color:#727272; }
.night_mode .card { background-color: #232323; color:#727272; }
.night_mode .xleft { border-left: 3px solid #a0a0a0; }
.night_mode .yleft { border-left: 3px solid #a0a0a0; }
.night_mode .zleft { border-left: 3px solid #a0a0a0; }
.night_mode .xcolor { #font-weight: bold; color:#a0a0a0; }
.night_mode .ycolor { #font-weight: bold; color:#a0a0a0; }
.night_mode .zcolor { #font-weight: bold; color:#a0a0a0; }
.night_mode .ximg{ background: url(_x-night.svg); background-size: 100%; background-repeat: no-repeat; background-position: center; }
.night_mode .yimg{ background: url(_y-night.svg); background-size: 100%; background-repeat: no-repeat; background-position: center; }
.night_mode .zimg{ background: url(_z-night.svg); background-size: 100%; background-repeat: no-repeat; background-position: center; }
.night_mode .hint { color: #727272; }
.night_mode u { color: #a0a0a0; background-color: #505050; border-bottom: 2px solid #5f5f5f; }
.night_mode img { filter: alpha(opacity=30); opacity:0.3; filter:invert;}
.night_mode audio { filter: alpha(opacity=30); opacity:0.3; }
.night_mode hr { background-color: #484848; }
/* ----------动画效果---------- */
.slide { position: relative; -webkit-animation: slide 1s 0s; -webkit-animation-fill-mode: forwards; }
@-webkit-keyframes slide {
0% { opacity: 0 ; top: 100px; }
50% { opacity: 0.8; top: -10px; }
100% { opacity: 1.0; top: -3px; }
}
背面
{{FrontSide}}
<div class="gn_box">
<h3><center><font color=#3000CF>倒</font><font color=#1900E6>计</font><font color=#0200FD>时</font>
</center></h3>
<center>
<div id="CountMsg" class="HotDate">
<span id="t_d">0 天</span>
</div>
</center>
<script type="text/javascript"> function getRTime() {
var EndTime = new Date('2020/05/09 08:00:00');
var NowTime = new Date();
var t = EndTime.getTime() - NowTime.getTime();
var d = Math.floor(t / 1000 / 60 / 60 / 24);
var h = Math.floor(t / 1000 / 60 / 60 % 24);
var m = Math.floor(t / 1000 / 60 % 60);
var s = Math.floor(t / 1000 % 60);
document.getElementById("t_d").innerHTML = d + " 天";
}
setInterval(getRTime, 1000);
</script>
</div>
{{#答案}}
<div class="h2 xleft slide"><hr>{{答案}}</div>
{{/答案}}
{{#笔记}}
<br><div class="slide">
<div class="h1 ycolor yleft">
<span class="yimg"><img src="_space.png" height="24" width="24" /></span>
笔记
</div>
<div class="h2 yleft">{{笔记}}</div></div>
{{/笔记}}
{{#相关知识}}
<br><div class="slide">
<div class="h1 zcolor zleft">
<span class="zimg"><img src="_space.png" height="24" width="24" /></span>
相关知识
</div>
<div class="h2 zleft">{{hint:相关知识}}</div></div>
{{/相关知识}}
网友评论