搜索到
4
篇与
网站建设
的结果
-
Typecho开启Gzip压缩加速网站 Gzip简介GZip压缩，是一种网站速度优化技术，也是一把SEO优化利器，许多网站都采用了这种技术，以达到提升网页打开速度、缩短网页打开时间的目的。网站采用Gzip压缩，还有一个好处，就是让你少了一份流量超标的担心。因为Gzip开启以后会将输出到用户浏览器的数据进行压缩的处理，这样就会减小通过网络传输的数据量，而这个，也正是提升网页打开时间的原因所在。首先看未开启的效果（本主题为例）从上图可以看到，这个api接口的大小是21kb，请求时间539ms接着开启gzip压缩很明显的可以看到区别，压缩后只有4.5kb大小，并且时间缩短到了99ms，极大的优化了网站速度开启方法打开typecho目录下的 index.php，并在开头添加 ob_start('ob_gzhandler'); 即可。{message type="info"}注：本文转自：Joe主题作者:https://as.js.cn/post/53.html{/message} -
-
Github+PicGo+jsDelivr搭建免费图床 一、图床是啥？图床一般是指储存图片的服务器，我们在部署页面的时候，图片等等往往是以链接的方式实现的。这种方式，实现了一次存储，多地移植的效果，大大减轻服务器压力，还能提高效率。二、步骤：1.Github创建GitHub图床之前，需要注册/登陆GitHub账号1.1创建Repository点击"New repository"按钮1.2 生成一个Token1.2.1回到主页，点击"Settings"按钮1.2.2点击Developer settings1.2.3点击Personal access tokens1.2.4点击Generate new token（这里点击之后需要验证是否为本人，输入密码验证）1.2.5勾选红框后点击创建注：创建成功后，会生成一串token，这串token之后不会再显示，一定要保存下来!!!其实忘记了也不要紧，点击重新生成，这个每次都不一样。2.PicGo2.1下载安装PicGopicgo下载地址picgo的Github仓库2.2 配置注：*分支名填写main(2020年10月1日，GitHub官方将默认的主分支master改成了main，如果您是这之前建的仓库，请在PicGo中将main替换成master，或者在GitHub中将主分支main改为master）自定义域名(图片地址):<div>https://cdn.jsdelivr.net/gh/用户名/仓库名</div>3.jsDelivrjsDelivr用于加速，图片地址如下：<div>https://cdn.jsdelivr.net/gh/用户名/仓库名/文件路径</div>注：GitHub仓库强制容量为100G,注意空间。
-
网站红灯笼代码 网站顶部红灯笼代码如下注：放入body标签里<div><style> .deng-box { position: fixed; top: -30px; right: -20px; z-index: 999; pointer-events:none; } .deng-box1 { position: fixed; top: -30px; right: 30px; z-index: 999; pointer-events:none; } .deng-box2 { position: fixed; top: -30px; left: 30px; z-index: 999; pointer-events:none; } .deng-box3 { position: fixed; top: -30px; left: -20px; z-index: 999; pointer-events:none; } .deng-box3 .deng { position: relative; width: 120px; height: 90px; margin: 50px; background: #d8000f; background: rgba(216, 0, 15, 0.8); border-radius: 50% 50%; -webkit-transform-origin: 50% -100px; -webkit-animation: swing 5s infinite ease-in-out; box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1); } .deng-box1 .deng { position: relative; width: 120px; height: 90px; margin: 50px; background: #d8000f; background: rgba(216, 0, 15, 0.8); border-radius: 50% 50%; -webkit-transform-origin: 50% -100px; -webkit-animation: swing 5s infinite ease-in-out; box-shadow: -5px 5px 30px 4px rgba(252, 144, 61, 1); } .deng { position: relative; width: 120px; height: 90px; margin: 50px; background: #d8000f; background: rgba(216, 0, 15, 0.8); border-radius: 50% 50%; -webkit-transform-origin: 50% -100px; -webkit-animation: swing 3s infinite ease-in-out; box-shadow: -5px 5px 50px 4px rgba(250, 108, 0, 1); } .deng-a { width: 100px; height: 90px; background: #d8000f; background: rgba(216, 0, 15, 0.1); margin: 12px 8px 8px 8px; border-radius: 50% 50%; border: 2px solid #dc8f03; } .deng-b { width: 45px; height: 90px; background: #d8000f; background: rgba(216, 0, 15, 0.1); margin: -4px 8px 8px 26px; border-radius: 50% 50%; border: 2px solid #dc8f03; } .xian { position: absolute; top: -20px; left: 60px; width: 2px; height: 20px; background: #dc8f03; } .shui-a { position: relative; width: 5px; height: 20px; margin: -5px 0 0 59px; -webkit-animation: swing 4s infinite ease-in-out; -webkit-transform-origin: 50% -45px; background: #ffa500; border-radius: 0 0 5px 5px; } .shui-b { position: absolute; top: 14px; left: -2px; width: 10px; height: 10px; background: #dc8f03; border-radius: 50%; } .shui-c { position: absolute; top: 18px; left: -2px; width: 10px; height: 35px; background: #ffa500; border-radius: 0 0 0 5px; } .deng:before { position: absolute; top: -7px; left: 29px; height: 12px; width: 60px; content: " "; display: block; z-index: 999; border-radius: 5px 5px 0 0; border: solid 1px #dc8f03; background: #ffa500; background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03); } .deng:after { position: absolute; bottom: -7px; left: 10px; height: 12px; width: 60px; content: " "; display: block; margin-left: 20px; border-radius: 0 0 5px 5px; border: solid 1px #dc8f03; background: #ffa500; background: linear-gradient(to right, #dc8f03, #ffa500, #dc8f03, #ffa500, #dc8f03); } .deng-t { font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif; font-size: 3.2rem; color: #dc8f03; font-weight: bold; line-height: 85px; text-align: center; } .night .deng-t, .night .deng-box, .night .deng-box1 { background: transparent !important; } @-moz-keyframes swing { 0% { -moz-transform: rotate(-10deg) } 50% { -moz-transform: rotate(10deg) } 100% { -moz-transform: rotate(-10deg) } } @-webkit-keyframes swing { 0% { -webkit-transform: rotate(-10deg) } 50% { -webkit-transform: rotate(10deg) } 100% { -webkit-transform: rotate(-10deg) } } @media screen and (max-width: 700px) { .deng-box { right: 55px; zoom:0.45 } .deng-box1 { right: 190px; zoom:0.45 } .deng-box2 { left: 190px; zoom:0.45 } .deng-box3 { left: 55px; zoom:0.45 } } </style> <body> <!-- 灯笼1 --> <div class="deng-box"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"><div class="deng-t">乐</div></div> </div> <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div> </div> </div> <!-- 灯笼2 --> <div class="deng-box1"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"><div class="deng-t">快</div></div> </div> <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div> </div> </div> <!-- 灯笼3 --> <div class="deng-box2"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"><div class="deng-t">春</div></div> </div> <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div> </div> </div> <!-- 灯笼4 --> <div class="deng-box3"> <div class="deng"> <div class="xian"></div> <div class="deng-a"> <div class="deng-b"><div class="deng-t">新</div></div> </div> <div class="shui shui-a"><div class="shui-c"></div><div class="shui-b"></div></div> </div> </div> </body></div>
