沫言生活记录 - 教程
http://www.6hi.cn/category/jiaocheng/
生活不易,猪猪叹气,叹气泄气,还得打气。
-
typecho添加灯笼
http://www.6hi.cn/163.html
2023-01-22T18:34:00+08:00
新年已到,祝大家新年快乐,给你的博客添加小灯笼,该灯笼是由 html+css 完成的,且显示效果也很好看,遂提供大家一个设置教程。添加 html 代码如果您的 typecho 博客模板是 handsome,则直接在主题后台自定义输出 body 尾部的 HTML 代码中添加如下 html 代码:<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>
<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>添加 css 代码在您的模板后台自定义 css 中添加如下代码:.deng-box1 {
position: fixed;
top: -30px;
left: 5px;
z-index: 9999;
pointer-events: none;
}
.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 50px 4px rgba(250, 108, 0, 1);
}
.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);
}
.xian {
position: absolute;
top: -20px;
left: 60px;
width: 2px;
height: 20px;
background: #dc8f03;
}
.deng-box1 {
pointer-events: none;
}
.deng-a {
width: 100px;
height: 90px;
background: #d8000f;
background: rgba(216, 0, 15, 0.1);
margin: 12px 8px 8px 10px;
border-radius: 50% 50%;
border: 2px solid #dc8f03;
}
.deng-b {
width: 45px;
height: 90px;
background: #d8000f;
background: rgba(216, 0, 15, 0.1);
margin: -2px 8px 8px 26px;
border-radius: 50% 50%;
border: 2px solid #dc8f03;
}
.deng-t {
font-family: 华文行楷,Arial,Lucida Grande,Tahoma,sans-serif;
font-size: 1.5rem;
color: #ffa500;
font-weight: bold;
line-height: 42px;
text-align: center;
width: 25px;
margin: 0 auto;
}
.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-c {
position: absolute;
top: 18px;
left: -2px;
width: 10px;
height: 35px;
background: #ffa500;
border-radius: 0 0 0 5px;
}
.shui-b {
position: absolute;
top: 14px;
left: -2px;
width: 10px;
height: 10px;
background: #dc8f03;
border-radius: 50%;
}
.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-box2 {
position: fixed;
top: -30px;
right: 5px;
z-index: 9999;
pointer-events: none;
}
.deng-box2 .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-box2 {
pointer-events: none;
}
@-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)
}
}如果您不想在手机端显示效果,可以在自定义 css 中追加如下代码:@media (max-width: 900px){.deng-box1{display:none;}}
@media (max-width: 900px){.deng-box2{display:none;}}最后,清除网站缓存刷新下页面,灯笼就出来了。特别说明:本文来源于网络
-
网站源码分享合集
http://www.6hi.cn/151.html
2022-08-19T23:29:00+08:00
本站源码分享类文章即将迁移至jishula.com后续本站将不在分享源码,会在此分享网站源码,以及技术类文章。截至2022.8.19号jishula.com正在搭建中本站历史网站源码文章:
导航网源码
演示站:my.6hi.cn源码下载地址:https://6hi.cn/137.html
爱名米表系统源码
演示站:www.2ming.cn源码下载/搭建教程:[https://6hi.cn/132.html
相爱100件事源码
演示站:love.6hi.cn源码下载/搭建教程:https://6hi.cn/128.html
一款简洁的个人介绍页源码
演示站:liu.6hi.cn源码下载地址:https://6hi.cn/118.html
ww9w.cn 同款导航页源码
演示站:ww9w.cn源码下载地址:https://6hi.cn/77.html
动态个人介绍页源码
演示站:i.6hi.cn源码下载地址:https://6hi.cn/55.html
Time 时光相册搭建教程
演示站:time.6hi.cn源码下载地址 附搭建教程:https://6hi.cn/36.html
-
新手如何搭建自己的网站
http://www.6hi.cn/126.html
2022-07-25T16:27:00+08:00
新手如何零基础搭建一个搭建一个属于自己的网站,需要以下几个步骤:域名建站首先需要拥有一个属于自己的域名,可以选择在腾讯云阿里云聚名等注册商进行注册,市面上常见的有com cn net等,推荐大家注册这三种主流的后缀。如何注册以腾讯云为例,首先打开腾讯云官网注册一个自己的账号并实名认证通过,让后点击域名注册,输入自己想好的前缀点击注册即可,需要注意的是域名是按年购买续费的。服务器首先需要选择使用国外还是国内的服务器,选择国内的服务器需要进行备案,注意这里备案指的是备案自己的域名,选择国外则不需要备案。国外的服务器相对来说会比较贵一点而且国内用户访问会非常慢,国内服务器需要进行域名备案才可以使用,国内用户访问网站速度快。推荐大家进行网站备案选择国内服务器。如何挑选服务器新手首次建站选择一个配置最低的就可以,因为访问量比较少不太吃配置,服务器商有很多市面上常见的大厂有腾讯云阿里云华为云等。以腾讯云为例推荐购买最便宜的轻量应用服务器,购买地址https://curl.qcloud.com/1XazdfiS如图,最便宜的低至65/年,当然一个用户只能购买一次,而且续费不是同价。对于新手建站足够用了。如何使用服务器首先进入控制台,点击轻量应用服务器找到自己的服务器,点击更多-管理-重装系统让后选择官方镜像-应用镜像-宝塔 Linux 面板,进行安装,安装成功后会告诉你面板的账号密码以及地址。后返回刚才的页面,点击更多-管理-防火墙-放行80端口即可。以上操作完成后前往你的面板地址,输入账号密码登录即可,按照提示安装环境,等待安装成功后就可以建站啦!解析腾讯云控制台-域名-解析-找到自己的域名点击解析,点击添加记录主机记录就是域名前缀,常见用法有:www :解析后的域名为 www.dnspod.cn@ :直接解析主域名 dnspod.cn*:泛解析,匹配其他所有域名 *.dnspod.cn记录类型选择A,记录值填写自己服务器的公网IP,点击确认即可添加站点登录宝塔后点击网址,添加站点,输入自己的域名点击提交,提交成功后点击自己添加好网站的根目录进行上传文件,文件及网站的源码,可以去本博客下载自己喜欢的源码,比如https://6hi.cn/118.html个人介绍页源码,下载上传并解压即可。在次访问你的域名就可以看到漂亮的网站了。另外有什么不懂的可以在下方评论。
-
如何把图片转换为webp格式
http://www.6hi.cn/107.html
2022-07-23T15:56:00+08:00
什么是webpwebp是谷歌推出的一种图片格式,它的优点就是同等画面质量下,体积比 jpg、png 这些少了 25% 以上。webp图片的好处一张 jpg 图片大小"2M",转化为webp格式后成了"1M",这样以来可以减少服务器的存储空间,提高图片的加载速度。webp图片的坏处那么既然 webp 这么好,为什么没有大范围使用呢?因为老版本的浏览器可能不兼容,可以在 caniuse 上可以查到webp目前浏览器的兼容情况。废话不多说那么接下来教大家如何把jpg/png格式的图片转换为webp图片如何批量转换在市面上一些比较火的网站或者软件,不是收费就是不能批量转换。这里推荐大家一款应用,可以免费批量转换格式。IrfanView转换工具,IrfanView是一款快速、紧凑、小巧且免费的图像查看器和转换器,IrfanView官网为:www.irfanview.com另外推荐两个良心软件:智图、格式工厂如何下载安装首先需要下载安装包,根据自己的设备选择,32位就选32位的 64就选择64位的。选择下载安装程序安装即可。下载并安装完成后需要下载插件,这里建议直接下载所有插件。如何设置为中文首先需要下载安装语言包,下载地址https://www.irfanview.com/languages.htm下载完成后将下载的文件解压缩到“IrfanView\Languages\”文件夹中。启动IrfanView并进入“Options--> Change - Language”更改语言即可如何使用启动IrfanView并进入"文件 - 批量转换"选择需要转换的图片,如何选择转换后储存的目录,点击转换即可。
-
Typecho伪静态如何配置
http://www.6hi.cn/95.html
2022-07-22T23:10:00+08:00
伪静态开启前后对比Typecho如何完全配置伪静态首先需要在宝塔面板配置伪静态为typecho,也可以直接复制这串代码加到伪静态里,保存即可。 if (!-e $request_filename) {
rewrite ^(.*)$ /index.php$1 last;
}若设置伪静态后,网站无法正常访问,请尝试设置回 default。Typecho地址重写功能配置伪静态还需要在typecho后台-设置-永久链接-开启地址重写功能。地址重写即 rewrite 功能是某些服务器软件提供的优化内部连接的功能。打开此功能可以让你的链接看上去完全是静态地址。什么是伪静态,伪静态有什么作用伪静态是相对真实静态来讲的,通常我们为了是为了增强搜索引擎的友好面,非常有利于SEO。伪静态不仅对搜索引擎友好,而且看起来链接也非常的简介。如何自定义文章路径,使链接达到最简在typecho后台-设置-永久链接-自定义文章路径中选择个性化定义,更改为/{cid}.html这样以来伪静态就配置完成了,地址也做到最简了。最后提醒大家修改伪静态需谨慎,修改链接后会造成原链接失效的问题。
-
如何设置极度安全的密码?
http://www.6hi.cn/70.html
2022-07-20T21:11:00+08:00
前言不要去记你的密码,而是记住一种规则你将拥有无数个无法被破解的密码。不知道大家使用的密码里是否包含了自己的生日、名字这种字符,本篇文章为大家分享一下如何拥有一套强大的切安全的密码系统。一个密码的强大与否和他的字符的复杂程度有关,比如一串生日注册的密码,在暴力破解下只需要几秒就可以完成。暴力破解就是用计算机对数字、字母或符号进行各类组合,直到组合出你的密码,虽然听起来像是碰运气,但是只要计算机的速度够快,如何你的密码又简单的话,破解就是分分秒秒的事。如何设置极度安全的密码?处于安全考虑我们首先要优化密码的复杂程度,如何优化:首先不要包含你个人的任何信息,名字、生日或者是你喜欢的人的名字,通通不要!至少要包含数字、大小写字母和符号避免连续的数字和字母密码尽可能的长总之要选择一个只有你自己才能一眼看明白的密码还有一个非常重要的问题,就是你不要在所有平台使用相同的密码,当不法之徒知道了你的一个密码他就可以尝试登录的其他平台。还有就像是前些天"学习通"一样,有可能平台会不小心泄露用户的密码。md5加密除了以上这些以外还有一种更安全的方案就是md5加密这是一种不可逆的加密算法,程序员们应该都很熟悉,编程时非常常见的加密方式。完结撒花愿大家的密码永远不会被破解。特别声明:素材来源于网络
-
Typecho增加浏览数统计功能
http://www.6hi.cn/49.html
2022-07-18T22:44:00+08:00
Typecho本身是没有浏览量统计的,但是部分主题本身可能会有浏览量统计功能,如果没有就只能通过插件的方式来实现。如何添加浏览数统计插件首先需要下载此插件,后将插件上传到typecho文件夹下的 /usr/plugins/ 目录下。然后启动该插件,此插件会在 contents 表中新增字段:viewsNum,这样以来就有了浏览量统计的功能。浏览数据保存在 cookie中,在不清除 cookie 或者 cookie 未过期的情况下不会重复计数。添加完成后如图所示:typecho浏览量统计插件下载地址
typecho浏览量统计插件
密码:6hi.cn
-
Typecho评论邮件提醒
http://www.6hi.cn/46.html
2022-07-18T22:30:00+08:00
Typecho本身是没有评论邮件提醒功能的,可能有些主题作者会添加评论邮件提醒功能。但是部分主题本身没有评论邮件提醒的话,就只能通过插件的方式来添加该功能。如何使用评论邮件提醒插件首先需要下载此插件,让后将插件上传到typecho文件夹下的 /usr/plugins/ 目录下。然后启动该插件并配置smtp服务器、邮箱地址、密码、以及端口。以 QQ 邮箱为例。smtp 服务器地址: smtp.qq.com邮箱地址:用来发送邮件的账号密码:开启 smtp 服务的时候系统生成的 授权码 ,注意不是自己的邮箱登录密码端口:端口 465 或 587typecho评论邮件提醒文件下载地址
typecho评论邮件提醒插件
密码:6hi.cn
-
如何提高网站访问速度
http://www.6hi.cn/11.html
2022-07-16T00:50:00+08:00
本站访问速度我自认为还可以,但是和那些大佬比起来还是差很多,下面我讲为大家讲解一下我是如何提高网站访问速度的。使用国内服务器因为本站域名已经备案成功,所以使用的是国内服务器,这样以来要比国外以及香港快不少。图片压缩由于现在拍照设备都比较先进,像素自然高,随便一张照片就能高达十几M,这样以来用户访问网站时加载速度便会非常缓慢。我的解决方案是压缩图片,在图片失针少的前提下尽可能压缩图片的体积,这样以来图片的加载速度将会大大提升。我使用的图片压缩网站:https://tinypng.com/本站的卡片背景图之前用的是几十M大小的高清壁纸,所以用户首次加载也需要一定的时间,现已全部通过图片压缩的方式全部替换。转换图片格式为webp一张 jpg 图片大小 "2M",转化为 webp 格式后成了 "1M",这样以来可以减少服务器的存储空间,提高图片的加载速度。如何转换:https://6hi.cn/107.htmlCDN加速已经备案完成,那就自然要用cdn进行加速了。什么是cdn:CDN 的全称是 Content Delivery Network,即内容分发网络。CDN 是构建在网络之上的内容分发网络,依靠部署在各地的边缘服务器,通过中心平台的负载均衡、内容分发、调度等功能模块,使用户就近获取所需内容,降低网络拥塞,提高用户访问响应速度和命中率。CDN 的关键技术主要有内容存储和分发技术。我使用的是腾讯云的cdn,目前首单活动3元50G还是比较划算的活动链接:【腾讯云】爆款云服务器限时体验20元起,更多上云必备产品低至1元我刚购买完腾讯云就发短信告诉我新用户首购赠送10G国内流量包。让后呢,我刚接入成功又给我发短信说赠送10G。最后我配置完成又赠送了100G免费试用流量包,分5个月每个月20G。这次腾讯云实在是太良心了!三块钱我算了一下一共买了170G的流量包,买50G送120G实在是舒服。镜像存储镜像存储服务是一种快速的数据迁移和加速服务。可以帮助用户实现无缝数据迁移。它实现的功能是用户在访问镜像域名上的一个资源时,云存储会先检测该资源在云存储服务器上是否已经存储,如果有则直接返回,没有的话,会根据路径到源站(也就是你的博客)获取对应的资源,然后返回给用户。除了用户第一次访问时要回源速度稍慢,后面就会完整发挥 CDN 的优势,速度都会非常快。举个栗子,假如我博客的域名是 https://6hi.cn,配置的镜像存储域名是 https://cdn.6hi.cn,那么,在第一次访问下面这个链接时:https://cdn.6hi.cn/path/to/whatever/pig.jpg镜像存储就会到下面这个地址获取内容, 然后返回给用户:https://6hi.cn/path/to/whatever/pig.jpg后面镜像存储已经存储了这张图片时,就会直接返回给用户,速度很快。以上为我自己所用的几个方法,当然优化网站还有很多的方法,暂时就不介绍了(打死也不会说其他方法我不会的)。可能你觉得我的博客图片加载速度还是缓慢,这主要是我文章卡片背景图引起的,可能有些压缩的不够彻底,所以就算你网速在好,加载图片还是很缓慢的。放上一张测速图,绿油油的真好!测速详情: https://www.boce.com/http/3df0b6e73af8780a29d8e231c198ede0.html咦,鸡屁股为啥不绿
-
QQ头像获取直链
http://www.6hi.cn/10.html
2022-07-16T00:41:00+08:00
QQ头像获取直链用别人提供的不如用官方的1.API 接口(qq 号式):https://q1.qlogo.cn/g?b=qq&nk=QQ号码&s=640不想用 ssl,请把 s 去掉。640 是大小,可以是 640,1002.API 接口(邮箱式):https://q2.qlogo.cn/headimg_dl?dst_uin=QQ邮箱&spec=640亲测 100 也有效3.API 接口(来自 QQ 空间):https://qlogo.store.qq.com/qzone/QQ号/QQ号/大小同时它的地址前缀可以换成 qlogo1、qlogo2、qlogo3、qlogo4 哦,其实都一样的。 640,100 都行还可以利用 api 接口地址获取你的 QQ 空间头像地址:http://users.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?uins=1176996982再附一个 https 的 QQ 头像 API 接口:http://ptlogin2.qq.com/getface?appid=1006102&imgtype=3&uin=1176996982同样会返回 json 数据,然后自行提取你的专属头像网址。