原创文章,谢绝转载。
在这篇文章,我赌上一位理科男所有的审美。
接续上一篇的美化相关detail。
一、布局
上一篇一开始提到的是四行三列布局,且最大的iframe在最右边。
优化后布局感觉还是四行四列合适,且最大的iframe放在第二列,较为居中。
二、配色
关于背景配色,一开始我设计成略带黄色的白色,但是使用了一天之后感觉有点费眼睛:( 所以又改成黑色背景,但是又发现背景与字之间的对比度太大,反差太大还是有点费眼睛:( 经过我反复测试,找到一个自我感觉绝佳的背景颜色:RGB(12,30,24)
十六进制: #0C1E18
就是下图这个色(你可以右键保存下来这张图片做背景图片)
字当然是 RGB(255,255,255)
十六进制: #FFFFFF
(纯白)
三、关于索引iframe的调整
1.关于颜色
这个一开始我没注意,后来发现深色背景配蓝色链接字雀食是看不见,而且点击过的链接颜色还不一样,参差不齐,十分难看。
所以经过我的调整,把调整后的颜色代码贴下面:
a:link {
color: #FFFFFF;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #FFFFFF;
}
a:hover {
text-decoration: underline;
color: #CCCCCC;
}
a:active {
text-decoration: none;
}
2.关于边距
一开始忽略了这个问题,后来发现本来就不大的iframe框你给我默认左边上边留这么大位置。。。
还有行距也很大我的天啊。
经过调整,代码贴下面:
body {
margin-left: 0px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
line-height:0px;
}
3.关于其他
这个生成的HTML档在浏览器里面直接打开是没问题的,但是在iframe框里面打开如果字太长,他不会换行,他会本行重叠。
这个也是有解决办法的,就是给iframe加一个较长的宽度。
width:600px;
四、关于后台美化
这个Typecho就是以轻量简洁闻名,但是这个后台其实可以美化一下。
这个上网百度一下可以找到许多相关美化插件,这个就不说了。
五、关于字体
我个人十分推崇楷体字,感觉楷体字看着比宋体字舒服,所以选用了一款不涉及侵权问题的免费大厂楷体——方正楷体。说实话你现在看到的就是方正楷体。
注意是方正楷体而不是方正新楷体!新楷体不是免费的哦。
大概就是这样了。有问题在下面评论区留言哦。
下面这个链接是该文章的上篇。