本网站优化代码以及添加其他小工具

2024年4月12日10:20:43 1
微信搜一搜 ts小陈

本站美化以及增加的其他小工具修改

一、自定义样式

本站样式修改css，可根据备注删除不要的样式，将以下css添加到后台-定制风格-自定义样式中即可。

  1. /*首页关于本站修改*/
  2. #feed_widget a {
  3. color: #000;
  4. width: 40px;
  5. display: block;
  6. text-align: center;
  7. height: 40px;
  8. line-height: 34px;
  9. margin: 0 auto;
  10. border-radius: 20px;
  11. border: 1px solid #ddd;
  12. }
  13. #feed_widget .feed a {
  14. color: #d28300;
  15. border: 1px solid #d28300
  16. }
  17. #feed_widget .feed a:hover {
  18. background: #d28300;
  19. color: #fff !important;
  20. border: 1px solid #d28300
  21. }
  22. #feed_widget .weixin a {
  23. color: #248a34;
  24. border: 1px solid #248a34;
  25. }
  26. #feed_widget .weixin a:hover {
  27. background: #248a34;
  28. color: #fff! important;
  29. border: 1px solid #248a34
  30. }
  31. #feed_widget .tsina a {
  32. color: #c40000;
  33. border: 1px solid #c40000
  34. }
  35. #feed_widget .tsina a:hover {
  36. background: #c40000;
  37. color: #fff !important;
  38. border: 1px solid #c40000
  39. }
  40. #feed_widget .tqq a {
  41. color: #4e91d1;
  42. border: 1px solid #4e91d1
  43. }
  44. #feed_widget .tqq a:hover {
  45. background: #4e91d1;
  46. color: #fff !important;
  47. border: 1px solid #4e91d1
  48. }
  50. /*幻灯片缩略图修改*/
  51. #slideshow #slider img{border-radius:5px;border:0}
  52. .thumbnail{box-shadow: rgba(0,0,0,0.5) 2px 2px 2px;border-radius:5px;border:0}
  53. /* 导航栏加粗*/
  54. #site-nav .down-menu li {
  55. font-weight: bold;
  56. }
  57. .breadcrumb {
  58. margin: 10px auto;
  59. border: 1px solid #ddd;
  60. border-radius: 2px;
  61. background-color: #fff;
  62. padding-bottom: 4px;
  63. padding-left: 10px;
  64. }
  65. /* 右侧滚动条按钮美化*/
  66. #scroll {
  67.     width: 32px;
  68.     float: rightright;
  69.     position: fixed;
  70.     rightright: 10px;
  71.     bottombottom: 50px;
  72.     z-index: 9999;
  73. }
  75. #scroll li a {
  76.     font-size: 16px;
  77.     color: #fff;
  78.     width: 32px;
  79.     height: 32px;
  80.     line-height: 28px;
  81.     text-align: center;
  82.     vertical-align: middle;
  83.     margin-top: 4px;
  84.     display: block;
  85.     cursor: pointer;
  86.     border: 1px solid #ddd;
  87.     border-radius: 15px;
  88.     box-shadow: 0 1px 1px rgba(0,0,0,0.04);
  89. }
  91. #scroll li a:hover {
  92.     background: #2f889a;
  93.     color: #fff;
  94.     border: 1px solid #2f889a;
  95.     transition: all .2s ease-in 0s;
  96. }
  98. .scroll-h {
  99.     background-color: #ff5e5c !important;
  100. }
  102. .scroll-c {
  103.     background-color: #24a5db !important;
  104. }
  106. .scroll-b {
  107.     background-color: #ff9531 !important;
  108. }
  110. #gb2big5 {
  111.     background-color: #aec534 !important;
  112. }
  114. .qr {
  115.     background-color: #4a4a4a !important;
  116. }
  118. .qqonline a {
  119.     background: #d4ae45!important;
  120. }
  122. @media screen and (min-width:900px) {
  123.     #scroll li a:hover {
  124.         background: #2f889a;
  125.         color: #fff;
  126.         border: 1px solid #2f889a;
  127.         transition: all 0.2s ease-in 0s;
  128.     }
  129. }
  131. .qr-img {
  132.     position: fixed;
  133.     background: #fff;
  134.     bottombottom: 50px;
  135.     rightright: 50px;
  136.     max-width: 300px;
  137.     z-index: 9999;
  138.     display: none;
  139.     border-radius: 4px;
  140.     padding: 10px 10px 2px 10px;
  141.     animation: fade-in;
  142.     animation-duration: 0.5s;
  143.     -webkit-animation: fade-in 0.5s;
  144.     border: 1px solid #ddd;
  145.     box-shadow: 0 1px 1px rgba(0,0,0,0.05);
  146. }
  148. #output img {
  149.     position: absolute;
  150.     top: 72px;
  151.     rightright: 72px;
  152.     width: 25px;
  153.     height: 25px;
  154. }
  156. .qr .fa-qrcode {
  157.     font-size: 20px !important;
  158.     line-height: 32px !important;
  159. }
  161. .qr-img .arrow {
  162.     position: absolute;
  163.     font-size: 26px;
  164.     bottombottom: 2px;
  165. }
  167. .arrow-y {
  168.     color: #fff;
  169.     rightright: -8px;
  170. }
  172. .arrow-z {
  173.     color: #c6c6c6;
  174.     rightright: -9px;
  175. }
  177. #output td {
  178.     border: none;
  179. }
  181. #output td {
  182.     padding: 0;
  183. }
  185. .page-template-template-blog #scroll li a.scroll-c,.page-template-template-code #scroll li a.scroll-c,.page-template-template-links #scroll li a.scroll-c,.page-template-template-archives #scroll li a.scroll-c,.page-template-template-cms #scroll li a.scroll-c,.page-template-template-hot #scroll li a.scroll-c,.page-template-template-tag #scroll li a.scroll-c,.page-template-template-tougao #scroll li a.scroll-c,.page-template-template-contact #scroll li a.scroll-c,.page-template-template-message #scroll li a.scroll-c,.page-template-template-baidu #scroll li a.scroll-c {
  186.     display: none;
  187. }
  189. #scroll li a {
  190.     background: #2f9a3c;
  191. }
  192. .tagcloud {
  193.     overflow: hidden;
  194.     padding: 15px 0 12px 15px;
  195. }
  196. .tagcloud a {
  197.     float: left;
  198.     width: 31.3333%;
  199.     margin: 0 1% 1% 0;
  200.     padding: 0 8px;
  201.     color: #000;
  202.     height: 29px;
  203.     line-height: 29px;
  204.     text-align: center;
  205.     opacity: .7;
  206.     border-radius: 2px;
  207.     overflow: hidden;
  208. }
  209. /*去掉幻灯上的标题文字*/
  210. .slider-caption {display: none; }
  211. /*顶部导航添加渐变色*/
  212. #top-header {
  213.     background: linear-gradient(-30deg,rgb(250 234 178 / 71%) 10%,rgba(161,230,243,.78)) no-repeat;
  214.     border-bottom: 1px solid #dedede;
  215. }
  216. /* 选中效果浮动背景*/
  217. .entry-more a {
  218.     opacity:0
  219. }
  220. .post:hover .entry-more a {
  221.     rightright:0;
  222.     opacity:1;
  223. }
  224. .post {
  225.     transition:all 0.3s ease 0s;
  226. }
  227. .post:hover {
  228.     transform:translateY(-3px);
  229.     z-index:1;
  230.     -webkit-box-shadow:0 15px 32px rgb(197 175 241)!important;
  231. }

二、网站底部添加运行时长

  1. <p>已稳定运行 <span id="span_dt_dt" style="color: #0196e3;"></span>
    <script type="text/javascript">
    function show_date_time(){
    window.setTimeout("show_date_time()", 1000);var BirthDay = new Date("1/25/2021 00:00:00");var today = new Date();var timeold = (today.getTime() - BirthDay.getTime());var sectimeold = timeold / 1000;
    var secondsold = Math.floor(sectimeold);var msPerDay = 24 * 60 * 60 * 1000;var msPer = 365 * 24 * 60 * 60 * 1000;var e_ysold = timeold / msPer;var ysold = Math.floor(e_ysold);var e_daysold = timeold / msPerDay;var daysold = Math.floor((e_ysold - ysold) * 365);var aaasold = Math.floor(e_daysold);var e_hrsold = (e_daysold - aaasold) * 24;var hrsold = Math.floor(e_hrsold);var e_minsold = (e_hrsold - hrsold) * 60;var minsold = Math.floor((e_hrsold - hrsold) * 60);var seconds = Math.floor((e_minsold - minsold) * 60);document.getElementById("span_dt_dt").innerHTML = '<font style="color:#FF0000">' + ysold + '</font> 年<font style="color:#FF0000">' + daysold + '</font> 天 <font style="color:#FF0000">' + hrsold + '</font> 时 <font style="color:#FF0000">' + minsold + '</font> 分 <font style="color:#FF0000">' + seconds + '</font> 秒';
    }show_date_time();</script>

 

ts小陈

发表评论（不允许含有网址！）

:?: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :cry: :mrgreen: :neutral: :razz:

😀

已登录用户不需要填写以下内容

目前评论：1条   互动热度：普通

    • avatar LHB 辽宁省鞍山市 移动 0
      回复 2024年5月5日 下午5:57  沙发

      真的很负责，谢谢小陈