【分享】博客美化(8)让你的博客“推荐按钮”动起来

简介:
  博客园美化相关文章目录: 博客园博客美化相关文章目录

  本文原文地址:博客美化(8)让你的博客“推荐按钮”动起来

  这篇文章使用的代码也是来自于博客园的marvin,非常感谢。实现的效果也非常简单,就是让“推荐和反对”按钮随着屏幕的滚动固定起来,博客园默认的按钮是在文章最下方的。以前看到很多网友都这样做,的确方便很多,可以在看的过程中,随时去点击推荐按钮,而不是去找按钮。使用方法很简单,在博客园后台的“设置”-“页面定制CSS代码”中添加下面的代码:

<style type="text/css"> 
#div_digg{
  position:fixed;
  bottom:5px;
  width:140px;
  right:390px;
  border:2px solid #6FA833;
  padding:10px;
  background-color:#fff;
  border-radius:5px 5px 5px 5px !important;
  box-shadow:0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
}
</style>

虽然我不很懂CSS,但看上面的代码也很好懂,这里我根据自己博客的结构,稍微把参数改了一下,主要是距离底部的距离和离右边的距离,可以根据需要修改。下面就是显示的样式,虽然不懂CSS,但可以从博客园网友的博客中发现很多好东西,虽然简单,也分享一下,非常感谢marvin。看看效果:

相关文章
|
搜索推荐
【博客美化】03.分享按钮
【博客美化】03.分享按钮
【博客美化】03.分享按钮
|
C语言
博客总结(导航)
博客总结(导航)
156 0
博客总结(导航)
|
前端开发 搜索推荐
【博客美化】01.推荐和反对炫酷样式
【博客美化】01.推荐和反对炫酷样式
【博客美化】01.推荐和反对炫酷样式
|
JavaScript 前端开发
【全网最全的博客美化系列教程】07.添加一个分享的按钮吧
全网最全的博客美化系列教程相关文章目录 【全网最全的博客美化系列教程】01.添加Github项目链接 【全网最全的博客美化系列教程】02.添加QQ交谈链接 【全网最全的博客美化系列教程】03.给博客添加一只萌萌哒的小仓鼠 【全网最全的博客美化系列教程】04.
1546 0