页面定制源码
2019/10/24 UPD：修改了标题字体，然后为了和背景配一下，颜色也改了……一个下午再次打水漂，这次我会F12找costom.css了……然后在侧边栏加了个一言
虽然我很想加个看板娘，但是不知道怎么看板娘一加整个排版都受影响（会莫名其妙标题下移，侧边栏字体变大）
现在的代码
#google_ad_c1, #google_ad_c2 {display:none;}
.syntaxhighlighter a, .syntaxhighlighter div, .syntaxhighlighter code, .syntaxhighlighter table, .syntaxhighlighter table td,
.syntaxhighlighter table tr, .syntaxhighlighter table tbody, .syntaxhighlighter table thead, .syntaxhighlighter table caption,
.syntaxhighlighter textarea {
font-size: 20px!important;
}
#home {
opacity: 0.9;
margin: 0 auto;
width: 55%;
min-width: 950px;
background-color: #fff;
padding: 30px;
margin-top: 30px;
margin-bottom: 50px;
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
}
body {
color: #000;
background: url(https://i.loli.net/2019/10/23/RuXFHe962UdSvkt.jpg
) fixed;
background-size: 100%;
background-repeat: no-repeat;
font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
font-size: 12px;
min-height: 101%;
}
#main {
width: 100%;
text-align: left;
margin-top: 10px;
}
#blogTitle h1 {
font-size: 30px;
font-weight: bold;
font-family: "Comic Sans MS";
line-height: 1.5em;
margin-top: 20px;
color: #515151;
}
#blogTitle h2 {
font-weight: normal;
font-size: 13px;
font-size: .928571429rem;
line-height: 1.846153846;
color: #757575;
float: left;
}
h1, h2, h3 {
margin-top: 5px;
margin-bottom: 15px;
}
#navList a:hover {
color: #4C9ED9;
text-decoration: none;
}
#navList a {
display: block;
width: 5em;
height: 22px;
float: left;
text-align: center;
padding-top: 18px;
}
#navigator {
font-size: 15px;
border-bottom: 1px solid #ededed;
border-top: 1px solid #ededed;
height: 50px;
clear: both;
margin-top: 25px;
}
.catListTitle {
margin-top: 21px;
margin-bottom: 10.5px;
text-align: left;
border-left: 10px solid rgba(82, 168, 236, 0.8);
padding: 10px 0 14px 10px;
background-color: #f5f5f5;
}
#ad_under_post_holder #google_ad_c1,#google_ad_c2{
display: none !important;
}
background-size: 105%;
background-repeat: no-repeat;
font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
font-size: 12px;
min-height: 101%;
}
.day .postTitle a {
padding-left: 10px;
}
.postTitle a:link, .postTitle a:visited, .postTitle a:active {
font-family: cursive;
color: #49989d;
transition: all .4s linear 0s;
}
.postTitle {
border-left: 3px solid #49989d;
margin-bottom: 10px;
font-size: 20px;
float: right;
width: 100%;
clear: both;
}
#postTitle h1{
font-family: "Comic Sans MS";
color:#49989d
border-left: 3px solid #49989d;
font-size: 180%;
font-weight: bold;
float: left;
line-height: 1.3;
width: 100%;
padding-left: 10px;
}
#topics .postTitle {
font-family: "Comic Sans MS";
color:#49989d;
border-left: 3px solid #49989d;
font-size: 180%;
font-weight: bold;
float: left;
line-height: 1.3;
width: 100%;
padding-left: 10px;
}
#comment_form_container .comment_textarea {
width: 550px;
height: 200px;
font-size: 13px;
padding: 8px;
margin-bottom: 10px;
color: #555;
border: 1px solid #ddd;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}
一言
<meta charset="utf-8"/>
<h2><B>一言（ヒトコト）</B></h2>
<div class="daily a pome">
<div class="daily pome" id="qwq"></div>
<script>
var st=[ "<center>如果是你的话，一定可以做到！<br> ——魔卡少女樱 <br>", "<center>这世上没有什么偶然，有的只是必然。<br><center> ——xxxHOLiC<br>", "<center>摩可拿最喜欢摩可拿了！<br><center> ——TSUBASA 翼<br>", "<center>想哭的时候能哭出来，也是一种坚强吧。<br><center> ——法伊<br>", "<center>为了让两个未来都不消失，这家店就是为了那一天而存在的。<br><center> ——壹原侑子<br>", "<center>你一定能找到自己最喜欢的人，你最喜欢的人也一定最喜欢你。<br><center> ——魔卡少女樱<br>", "<center>已经结下的缘是不会消失的<br><center>——壹原侑子<br>", "<center>一切皆因人愿…<br><center> ——壹原侑子<br>", "<center>能够改变一个人的，只有相遇这件事。<br><center> ——壹原侑子", "<center>语言并不只是束缚自己而已，也会束缚别人。<br><center> ——壹原侑子<br>", "<center>需要代价哦。<br><center> ——壹原侑子<br>", "<center>但她最挂念的，还是你啊。<br><center> ——百目鬼静<br>", "<center>因为你寂寞的话……我也会……寂寞……<br><center> ——四月一日君寻<br>", "<center>最喜欢小葵了。<br><center>嗯，我也最喜欢四月一日了。<br><center>", "<center>我竟然没有拍到小樱的英姿！<br><center> ——大道寺知世<br>", "<center>我会一直在这里，等着侑子小姐回来。<br><center> ——四月一日君寻<br>", "<center>早安，黑钢。<br>——法伊", "<center>我不是你的小樱。<br> ——小樱"];
var num;
num=Math.floor((Math.random()*18));
document.write(st[num]);
var cli;
</script>
<div style="font-size: 1em; text-align: center; line-height: 1.5em; display: none; " id="qwq"></div>
<div style="text-align: right; margin-top: 15px; font-size: 0.9em; color: #666; display: none; " id="qwq"></div>
</div>
2019/10/23 UPD：由于最近有一张比较喜欢的图片所以就加了个背景……可惜这张图片像素不是很高……
2019/10/2 UPD：进行了一番魔改。。怎么都不满意。。最后选择返璞归真。。。
被续了大半个下午。。。感觉唯一的收获就是对HTML有了一点点理解。。。然而。。真的只是一点点。。。
不懂CSS，大概就是到处贺贺的吧。。反正就记录一下。。。
页面定制：
#Snow{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 99999;
background: rgba(0,0,0,0);
pointer-events: none;
}
#google_ad_c1, #google_ad_c2 {display:none;}
.syntaxhighlighter a, .syntaxhighlighter div, .syntaxhighlighter code, .syntaxhighlighter table, .syntaxhighlighter table td,
.syntaxhighlighter table tr, .syntaxhighlighter table tbody, .syntaxhighlighter table thead, .syntaxhighlighter table caption,
.syntaxhighlighter textarea {
font-size: 14px!important;
}
#home {
opacity: 0.8;
margin: 0 auto;
width: 65%;
min-width: 950px;
background-color: #fff;
padding: 30px;
margin-top: 30px;
margin-bottom: 50px;
box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
}
#blogTitle h1 {
font-size: 30px;
font-weight: bold;
font-family: "Comic Sans MS";
line-height: 1.5em;
margin-top: 20px;
color: #515151;
}
#blogTitle h2 {
font-weight: normal;
font-size: 13px;
font-size: .928571429rem;
line-height: 1.846153846;
color: #757575;
float: left;
}
h1, h2, h3 {
margin-top: 0px;
margin-bottom: 15px;
}
#navList a:hover {
color: #4C9ED9;
text-decoration: none;
}
#navList a {
display: block;
width: 5em;
height: 22px;
float: left;
text-align: center;
padding-top: 18px;
}
#navigator {
font-size: 15px;
border-bottom: 1px solid #ededed;
border-top: 1px solid #ededed;
height: 50px;
clear: both;
margin-top: 25px;
}
.catListTitle {
margin-top: 21px;
margin-bottom: 10.5px;
text-align: left;
border-left: 10px solid rgba(82, 168, 236, 0.8);
padding: 10px 0 14px 10px;
background-color: #f5f5f5;
}
#ad_under_post_holder #google_ad_c1,#google_ad_c2{
display: none !important;
}
body {
color: #000;
background: url(https://ymzqwq.files.wordpress.com/2019/07/2ff9090f0cf3d7ca4c99c14cfc1fbe096a63a9fe.jpg
) fixed;
background-size: 105%;
background-repeat: no-repeat;
font-family: "Helvetica Neue",Helvetica,Verdana,Arial,sans-serif;
font-size: 12px;
min-height: 101%;
}
#topics .postTitle {
border: 0;
font-size: 130%;
font-weight: bold;
float: left;
line-height: 1.5;
width: 100%;
padding-left: 5px;
}
div.commentform p{
margin-bottom:10px;
}
.comment_btn {
padding: 5px 10px;
height: 35px;
width: 90px;
border: 0 none;
border-radius: 5px;
background: #ddd;
color: #999;
cursor:pointer;
font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋体, Arial, sans-serif;
text-shadow: 0 0 1px #fff;
display: inline !important;
}
.comment_btn:hover{
padding: 5px 10px;
height: 35px;
width: 90px;
border: 0 none;
border-radius: 5px;
background: #258fb8;
color: white;
cursor:pointer;
font-family: "Lato", Helvetica Neue, Helvetica, Microsoft Yahei, 宋体, Arial, sans-serif;
text-shadow: 0 0 1px #fff;
display: inline !important;
}
#commentform_title {
background-image:none;
background-repeat:no-repeat;
margin-bottom:10px;
padding:0;
font-size:24px;
}
#commentbox_opt,#commentbox_opt + p {
text-align:center;
}
.commentbox_title {
width: 100%;
}
#tbCommentBody {
font-family:'Microsoft Yahei', Microsoft Yahei, 宋体, sans-serif;
margin-top:10px;
max-width:100%;
min-width:100%;
background:white;
color:#333;
border:2px solid #fff;
box-shadow:inset 0 0 8px #aaa;
// padding:10px;
height:250px;
font-size:14px;
min-height:120px;
}
.feedbackItem {
font-size:14px;
line-height:24px;
margin:10px 0;
padding:20px;
background:#F2F2F2;
box-shadow:0 0 5px #aaa;
}
.feedbackListSubtitle {
font-weight:normal;
}
#blog-comments-placeholder, #comment_form {
padding: none;
background: #fff;
-webkit-box-shadow: 1px 2px 3px #ddd;
box-shadow: 1px 2px 3px #ddd;
}
.feedback_area_title {
margin-bottom: 15px;
font-size: 1.8em;
}
.feedbackItem {
border-bottom: 1px solid #CCC;
margin-bottom: 10px;
padding: 5px;
background: rgb(248, 248, 248);
}
.color_shine {background: rgb(226, 242, 255);}
.feedbackItem:hover {-webkit-animation-name: color_shine;-webkit-animation-duration: 2s;-webkit-animation-iteration-count: infinite;}
#comment_form .title {
font-weight: normal;
margin-bottom: 15px;
}
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link href="css/demo.css" rel="stylesheet" />
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/demo.js"></script>
</head>
<body>
</body>
</html>
侧边栏公告：
<div class="Snow">
<canvas id="Snow"></canvas>
</div>
<script src="https://files.cnblogs.com/files/yjlblog/xue.js"></script>
<div className="sidebarMouse"><object type="application/x-shockwave-flash" style="outline:none;" data="https://files.cnblogs.com/files/jingmoxukong/mouse.swf?up_bodyColor=f0e9cc&up_feetColor=D4C898&up_eyeColor=000567&up_wheelSpokeColor=DEDEDE&up_wheelColor=FFFFFF&up_waterColor=E0EFFF&up_earColor=b0c4de&up_wheelOuterColor=FF4D4D&up_snoutColor=F7F4E9&up_bgColor=F0E4E4&up_foodColor=cba920&up_wheelCenterColor=E4EB2F&up_tailColor=E6DEBE&" width="240" height="160"><param name="movie" value="https://files.cnblogs.com/files/jingmoxukong/mouse.swf?up_bodyColor=f0e9cc&up_feetColor=D4C898&up_eyeColor=000567&up_wheelSpokeColor=DEDEDE&up_wheelColor=FFFFFF&up_waterColor=E0EFFF&up_earColor=b0c4de&up_wheelOuterColor=FF4D4D&up_snoutColor=F7F4E9&up_bgColor=F0E4E4&up_foodColor=cba920&up_wheelCenterColor=E4EB2E&up_tailColor=E6DEBE&"><param name="AllowScriptAccess" value="always"><param name="wmode" value="opaque"></object></div>
<embed wmode="transparent" src="https://files.cnblogs.com/files/jingmoxukong/honehone_clock_tr.swf" quality="high" bgcolor="#FDF6E3" width="240" height="110" name="honehoneclock" align="middle" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer">
<embed src="//music.163.com/style/swf/widget.swf?sid=590521&type=2&auto=0&width=320&height=66" width="340" height="86" allowNetworking="all"></embed>
大家好qwq<br>
坐标hzxjhs <br>
BIG JURUO <br>
little vegetable chicken <br>
天天被吊打 鏼鏼发抖 <br>
自己选择的路，跪着也要走完。 <br>
QQ:1984234044 <br>
最好备注省份学校ID什么的防误删 <br>
Email:ymzqwq@qq.com <br>
<a href="https://blog.csdn.net/ymzqwq">其实我在CSDN也有号</a> <br>
<a href="https://ymzqwq.wordpress.com/">并不OI向的wordpress博客（大概是生活向？或者反动向？）</a> <br>
校内的题放在那篇XX题里，密码是机房门牌号，格式混乱无比，连Markdown都基本懒得用，因为是随便写的（暴露本性）<br>
还有一些乱七八糟东西也有锁 <br>
想要尝试的可以滑动解锁（雾） <br>
滑动解锁不了的就可以放弃了
<div style = "display:none;">动态线条</div>
<script>
!function(){
function n(n,e,t){
return n.getAttribute(e)||t
}
function e(n){
return document.getElementsByTagName(n)
}
function t(){
var t=e("script"),o=t.length,i=t[o-1];
return{
l:o,z:n(i,"zIndex",-1),o:n(i,"opacity",.5),c:n(i,"color","0,0,0"),n:n(i,"count",99)
}
}
function o(){
a=m.width=window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth,
c=m.height=window.innerHeight||document.documentElement.clientHeight||document.body.clientHeight
}
function i(){
r.clearRect(0,0,a,c);
var n,e,t,o,m,l;
s.forEach(function(i,x){
for(i.x+=i.xa,i.y+=i.ya,i.xa*=i.x>a||i.x<0?-1:1,i.ya*=i.y>c||i.y<0?-1:1,r.fillRect(i.x-.5,i.y-.5,1,1),e=x+1;e<u.length;e++)n=u[e],
null!==n.x&&null!==n.y&&(o=i.x-n.x,m=i.y-n.y,
l=o*o+m*m,l<n.max&&(n===y&&l>=n.max/2&&(i.x-=.03*o,i.y-=.03*m),
t=(n.max-l)/n.max,r.beginPath(),r.lineWidth=t/2,r.strokeStyle="rgba("+d.c+","+(t+.2)+")",r.moveTo(i.x,i.y),r.lineTo(n.x,n.y),r.stroke()))
}),
x(i)
}
var a,c,u,m=document.createElement("canvas"),
d=t(),l="c_n"+d.l,r=m.getContext("2d"),
x=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||
function(n){
window.setTimeout(n,1e3/45)
},
w=Math.random,y={x:null,y:null,max:2e4};m.id=l,m.style.cssText="position:fixed;top:0;left:0;z-index:"+d.z+";opacity:"+d.o,e("body")[0].appendChild(m),o(),window.onresize=o,
window.onmousemove=function(n){
n=n||window.event,y.x=n.clientX,y.y=n.clientY
},
window.onmouseout=function(){
y.x=null,y.y=null
};
for(var s=[],f=0;d.n>f;f++){
var h=w()*a,g=w()*c,v=2*w()-1,p=2*w()-1;s.push({x:h,y:g,xa:v,ya:p,max:6e3})
}
u=s.concat([y]),
setTimeout(function(){i()},100)
}();
</script>
<div style = "display:none;"> 动态线条end</div>
<script type="text/javascript">
$(document).ready(function(){
var a_index = 0;
$("body").click(function(e){
var a = new Array("如果是你的话，一定可以做到！","你一定能找到自己最喜欢的人，你最喜欢的人也一定最喜欢你。","这世上没有什么偶然，有的只是必然。","已经结下的缘是不会消失的","你已经做出选择了","一切皆因人愿…","能够改变一个人的，只有相遇这件事。","需要代价哦。","能够不付代价、互相给予的，就只有“感情”而已。","语言并不只是束缚自己而已，也会束缚别人。","想哭的时候能哭出来，也是一种坚强吧。","为了让两个未来都不消失，这家店就是为了那一天而存在的。","摩可拿最喜欢摩可拿了！");
var $i = $("<span/>").text(a[a_index]);
a_index = (a_index + 1) % a.length;
var x = e.pageX,y = e.pageY;
$i.css({
"z-index": 99999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": randomColor()
});
$("body").append($i);
$i.animate({"top": y-180,"opacity": 0},1500,function() {
$i.remove();
});
function randomColor(){
let r = Math.floor(Math.random()*256)
let g = Math.floor(Math.random()*256)
let b = Math.floor(Math.random()*256)
return "rgb("+r+','+g+','+b+")"
}
});
});
</script>
页脚：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Live2D</title>
<link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/ymzqwq/waifu.css"/>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/ymzqwq/waifu.css">
<div class="waifu" id="waifu">
<div class="waifu-tips" style="opacity: 1;"></div>
<canvas id="live2d" width="280" height="250" class="live2d"></canvas>
<div class="waifu-tool">
<span class="fui-home"></span>
<span class="fui-chat"></span>
<span class="fui-eye"></span>
<span class="fui-user"></span>
<span class="fui-photo"></span>
<span class="fui-info-circle"></span>
<span class="fui-cross"></span>
</div>
</div>
<script src="https://files.cnblogs.com/files/ymzqwq/live2d.js"></script>
<script src="https://files.cnblogs.com/files/ymzqwq/waifu-tips.js"></script>
<script type="text/javascript">initModel()</script>
</body>
</html>
<link rel="stylesheet" type="text/css" href="https://files.cnblogs.com/files/yjlblog/flat-ui.min.css"/>
---------------------------------------------------------------------------------
此人很懒，没有留下签名。
此人很懒，没有留下签名。
