你好呀，很高兴你在看这里~

我和谁都不争，和谁争我都不屑，我爱大自然，其次就是艺术，我双手烤着生命之火取暖，火灭了，我也准备走了。

12月

原创 windows加载动画

先看效果：Windows加载动画应该是这样吧，不是也没事，懂原理之后这个运动曲线可以任意自己设置的~实现：1.定义标签： <div class="yongqi"> <div class="quan"> <div class="dian"></div> <div class="dian"></div> <div class="dian"></d

2020-12-29 23:08:21 2134 9

原创文字点闪特效 html+css

上效果先：先言：这是在网上看到的效果，觉得挺有趣，所以我也弄了一个然后写篇文章记录。实现：1.定义html标签： <h1> <span>北</span> <span>极</span> <span>光</span> <span>之</span> <span>夜</span> &lt

2020-12-28 01:05:19 7114 16

先看效果：原理：这个效果在网上挺常见的，所以我也写篇文章记录记录。原理是比较简单的，大致上就是有一个背景色为蓝色的圆形；然后圆形上面有一个或两个有弧度的白色方形盒子在旋转，通过白色遮住蓝色形成像是波浪的视差。实现：1.定义两盒子，quan就是那个圆形，shui就是圆里蓝色的背景； <div class="quan"> <div class="shui"></div> </div>2.基本样式，这样大致上就是得到一个蓝色背景

2020-12-26 01:44:33 17906 37

原创导航栏滚动渐变效果 html+css+js

先看效果：实现：1.定义导航栏的文字标签：<div class="tou"> <sapn class="logo"> 北极光。</sapn> <ul class="biao"> <li><a href="#"><a href="#">主页</a></li> <li><a href="#">个人简介</

2020-12-24 00:35:30 22869 48

原创图片扫描仪特效 html+css

效果：这样，有抖动的：无抖动的：实现：1.定义一个盒子：<body> <div class="tu"></div></body>2.基本样式，长宽背景图等等~ .tu{ width: 500px; height: 300px; background-image: url(8.jpg); background-size: 100% aut

2020-12-23 01:05:27 4370 11

原创 2.5D立体字体 html+css

效果：看似2.5d立体，<(￣︶￣)>　其实是阴影的叠加~写完后你放大再放大看就一目了然了。实现：1.定义标签放字体： <div> <p>LIFE OF PI</p> </div>2.css实现效果： div{ font-size: 8em; font-weight: bold; color: rgb(255, 255, 255);

2020-12-21 22:29:11 2364 1

原创 vue仿网易云音乐播放器源代码免费分享

先言：这是我以前用vue基础做的音乐播放器，功能是比较简单的，想着放电脑里存着也是吃灰，索性不如分享出来，众乐乐，源码我上传到资源里了，下载可以直接运行，需要的小伙伴可以去免费下载~下载地址：点我去下载。效果（如图，这是基本样式）：总结：哈哈哈，就放一张动图吧~...

2020-12-21 14:24:16 4236 4

原创网页黑夜模式白天模式切换 html+css+js

效果：先言：实现是很简单的，就是背景色的切换，用的是最基础的js；1.定义开关按钮标签，‘bai’就是里面那个小圆圈：<div class="kaiguan" > <div class="bai" id="anniu"></div> </div>2.开关按钮的样式： .kaiguan{ position: absolute; top: 20px;

2020-12-21 01:55:04 15798 34

原创百叶窗效果 html+css

效果：实现：1.定义父盒子，放入5张图片： <ul> <li><img src="1.jpg" alt=""><div>Night</div></li> <li><img src="2.jpg" alt=""><div>Night</div></li> <li><img src="4.jpg" alt="

2020-12-20 00:37:22 6876 11

原创快速搭建hexo博客并部署到github

前提：一般我们在学习了一段时间后，一般会想弄一个博客去写文章，别人在网上可以访问。自己写博客底层框架太久，所以这里用hexo博客框架快速生成自己的博客，自己只管写文章和魔改就行。实现：1.安装node.js和git：去下载就好，下载完就默认安装~链接：node.jsgit安装就不过多阐述了~2.出现版本号就是安装好了在cmd里面输入：node -v npm -v3.下载hexo框架：继续在cmd里输入以下：npm install -g hexo-cli回车然后等待安

2020-12-19 14:08:52 2034 2

原创书本翻页效果 html+css

效果：有些细节没处理好 (“▔□▔)实现：定义标签，shu是书本，feng是封面，wen是文字内容。 <div class="shu"> <div class="feng"></div> <div class="wen"> <h3 style="padding-top: 50px;padding-left: 40px;">Life of Pi</h3>

2020-12-19 00:32:28 18467 29

原创文字图片视差效果 html+css+js

话不多，先看效果：这是我在网上看到的一外国博主的创意，感觉不错，马上自己也敲了一个，果然不错~实现：1.先定义一段文字，多点，起码能超过浏览器的可视区：<section> <p> The only survivor couldn't tell us why the zimtrum sank. It seems that the speed of the ship's sinking is very fast. This theory

2020-12-18 01:05:09 2921 4

原创记一些css属性总结（一）

前言：今天刷短视频刷着刷着看了一个讲阿姆斯特朗登月可能看到外星人的视频，越看越上头，接着去又去搜看了他登月的场面~接着天马星空的感觉美国是不是隐藏外星人信息的事实，最终不由感叹宇宙真的是太大了，以至于自己身边的琐事都感觉没了意义，，，这可不行，还是发篇文章缓解缓解心情。至于文章，就如题，就是记录一些常见的css属性罢了。（以上为为我自言自语可跳过~）内容：1.transition属性：含义：过渡属性，通常用于鼠标经过元素时样式的改变。语法：transition: property durati

2020-12-17 19:02:29 4143 5

原创网页滚动条样式修改 html+css

前提：::-webkit-scrollbar这个伪类选择器能改（比如网页右侧的）滚动条样式，不过好像挺多浏览器不兼容，我也不是太熟。用用：对应改的部分::-webkit-scrollbar — 整个滚动条.::-webkit-scrollbar-button — 滚动条上的按钮 (上下箭头).::-webkit-scrollbar-thumb — 滚动条上的滚动滑块.::-webkit-scrollbar-track — 滚动条轨道.::-webkit-scrollbar-track-pie

2020-12-16 21:56:37 1307 6

原创文字波浪特效 html+css

先看效果：clip-path描好效果会更好原理：就是两段文本重叠一起，底层的没颜色，上面层的有颜色，然后通过动画再通过clip-path属性截取上层的部分显示~实现：1.定义两个相同的文本：<body> <h1 class="diyi">Ice~Land</h1> <h1 class="dier">Ice~Land</h1></body>2.给他们样式： h1{

2020-12-16 21:23:09 2022 1

原创网页随处点击出现小火花简约特效 html+css+js

先看效果，效果是比较简约的：原理：效果就是在网页的任何地方鼠标点击后都出现一个小火花~原理并不复杂，就是鼠标点击后生成一个盒子，盒子里放字体图标或文字，然后操控它们的属性变化，最后再让它们消失就好。（还有小火花是我本地的字体图标，可以用自己的方式引入图标，或只写文字也可）实现：1.写body属性，目的是这样就能获取点击的位置： body{ height: 100vh; }2.定义一个小火花第一次出现的初始样式： .tx{ font-family: '

2020-12-16 01:06:54 6208 13

原创文字聚光灯特效 html+css

先不说啥，上效果：前提：要用到一个clip-path属性，可以创建一个只有元素的部分区域可以显示的剪切区域。但是，这属性兼容性不太好，还没有得到所有主流浏览器广泛支持（比如Firefox和IE）。实现：1.定义一盒标签放文字：<body> <h1>北极光之夜</h1></body>2.给文本设置颜色和大小： h1{ position: relative; color: #6b6868;

2020-12-14 15:35:53 2802 7

原创炫彩流光按钮 html+css

话不多，先上效果：简介：用基础css做一个有一点炫酷的流光按钮，不止按钮，只要是盒子就行。具体步骤：1.先定义一个盒子当做按钮，如我就用a标签：<body> <a href="#" class="guang">button</a></body>2.先给a标签写基础的样式，比如长宽等等…： .guang{ position: relative; display: inline-block;

2020-12-14 13:40:24 12536 32

原创 3D立体相册 html+css

前言用css的transform属性做一个3D相册~~~值translate表示偏移；scale表示缩放；rotate就是转动。一、先看效果二、实现步骤1.我们知道一个正方体有6个面，所以定义一个父亲元素然后定义6个子元素作为6个面。每个面放一张图片。里面q1表示前面，h2表示后面，以此类推，就是首拼音。<div class="baba"> <div class="q1"> <img src="3d/1q.png"> </div&

2020-12-11 11:54:21 7815 25

原创 html标签盒子图片一直不停旋转 html+css

标题：有时候我们定义了一个div盒子或者图片或其它标签，想让其一直旋转。效果：其实它会一直旋转的，就不放动图了，放张静图装装样子。实现：1.比如：定义一个div： <div></div>2.给盒子样式（定义了长、宽和背景图）： div{ width: 200px; height: 200px; background-image: url("disc.png"); ba

2020-12-10 18:56:46 3306 5

原创 10分钟实现个人博客布置说说留言功能，Artitalk.js插件使用

问题：在我们学习了html与css的基础后，往往便申请了域名写了自己的个人博客。而个人博客常常有一个功能，那就是说说留言功能。而实现说说留言那必定得有后端数据库的数据交互支持才能实现，但是后端的环境布置与代码书写太复杂，我们也不想碰，就只想写页面。本着分享快乐的原则（＾∀＾●）ﾉｼ，所以想在分享一个js插件的好东西给学弟学妹们，10分钟就能布置好说说留言功能，再也不用担心处理复杂的后端问题啦。介绍：1.我们要使用的便是Artitalk.js插件，点击可以跳转网址Artitalk.js。2.也可以

2020-12-09 16:24:30 1551 4

原创判断移动端（手机）还是客户端（电脑）打开网页并跳转不同页面（首页）

要求：有时候我们移动端和客户端的首页因为布局问题所以是分开写的，所以下面js代码能实现判断移动端（手机）还是客户端（电脑）打开网页并跳转不同页面。实现 js代码： <script> if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) { window.location.href = "shouji.html";} else { window.location.href = "zaixia

2020-12-08 16:22:25 1377 1

原创网页实时显示已经运行了多少天 html+js

问题：能够在网页上实时显示此网页运行或存在了多少天。效果：实现：1.body标签添加下面代码：<body onload="time()">2.定义一个盒子显示天数，如：<h2 id="showtime"></h2>3.js代码：<script>/* 时间 */function time() { t_div = document.getElementById('showtime'); var now = new Date()

2020-12-07 22:57:54 2350 7

原创网页实时显示当前时间 html+js

效果：在网页上能实时显示当前的时间：这个秒会一直走的。实现代码1.在body标签里添加如下代码：<body onload="time()"></body>2.定义一个盒子标签来显示时间，也可以用其它标签，id设为“showtime”，如：<h2 id="showtime"></h2>3.js代码实现功能：<script>/* 时间 */function time() { t_div = document.getEl

2020-12-07 22:26:53 8847

原创子盒子在父盒子里居中对齐 html+css

题目：子盒子在父盒子里居中对齐一：父盒子加相对定位，子盒子加绝对定位实现。代码：1.定义父盒子与子盒子： <div class="jz"> <div class="jz2"> </div> </div>2.css样式实现子盒子居中对齐： .jz{ position: relative; height: 500px; width: 500px; background-col

2020-12-07 21:55:23 1770

原创溢出盒子的文字显示省略号 html+css

问题：在我们定义一个div或其它盒子时，往里面写文本，往往文字太多会溢出，如下所示：红色部分是我定义的一个有长宽的div盒子，但是显然还是太小，多余的文本溢出了。解决：1.单行文本溢出显示“…”： .yc{ width: 500px; height: 100px; background-color: rgb(226, 187, 187); white-space: nowrap; o

2020-12-07 21:08:21 1923 2

原创网页缓慢置顶回到顶部 html、css、js

题目：网页缓慢置顶回到顶部（ html、css、js）。。。鼠标点击回到顶部的盒子后，网页可先快后缓慢最终回到最初顶部。使用js的定时器实现。问题描述：鼠标点击回到顶部的盒子后，网页可先快后缓慢最终回到最初顶部。解决：1.先写一个div盒子，如可以把它固定定位到网页右下角，这样我们点击它时网页就可以回到顶部。当然，也可以把它放到任何的位置都是可以的。也可以用其它标签，只要定义的id是一样的就可以了。盒子：<div class="zd" id="ding"> 置顶 &lt

2020-12-07 20:30:44 2167 2

原创简单音乐播放器html+css+基础vue+含源码，有搜索和播放mv功能，代码可直接复制用。

题目：html+css+基础vue实现的简单音乐播放器（含源码），有搜索和播放mv功能，代码可直接复制用。问题描述：如果vue刚入门，掌握一些基础语法后就可以写一个简单的音乐播放器来练练手~~如果没学vue，也可以看看，体验下vue的人门。代码直接复制就能运行。这里详细说了html与css的布局，与vue基础的使用先看效果：代码实现：...

2020-12-07 17:37:57 3025 20

原创消除点击＜audio＞音乐播放器标签默认出现的边框 html+css

标题：消除点击音乐播放器标签默认出现的边框 html+css问题描述：在写html文件时我们写audio标签时，点击播放歌曲时默认出现边框（如图），我们想消除掉。解决方案：1.定义标签 <audio src="白安-是什么让我遇见这样的你.mp3" controls class="yinyue"></audio>通过添加outline属性解决 .yinyue{ outline: none; }效果现在点击播放就没默认的边框了。.

2020-12-07 14:52:28 2436 2

原创 java课程设计（简易计算器）源代码 JAVA 源代码有解析免费分享

标题：java课程设计简易计算器源代码 JAVA 源代码有解析免费分享先言这是我挺久以前课程设计java写的计算器，只能实现基本的功能，我现在分享出来希望能帮助到别人。写得其实挺一般的，见谅见谅。有课程设计任务的学弟学妹也是写计算器的可以看看参考参考。源代码里我写有挺多解析的，能帮助理解。功能描述：参考 Windows操作系统提供的计算器设计一个实用的计算器,要求除了具有普通的计算功能外，还具有保存计算过程的功能。①单击计算器上的数字按钮（0、1、2、3、4、5、6、7、8、9）可以设置参与计算

2020-12-07 14:13:48 11766 78

原创给字体添加背景图 HTML+CSS

标题：给字体添加背景图 HTML+CSS问题描述：我们知道盒子或方形容器里面可以通过 background-image: url(…);设置背景图片，而文字的设置背景图却甚少，其实文字也可以像盒子里放背景图的。解决方案：1.写一个div标签，里面写文字。<div class="ceshi"> 给字体添加背景图片。</div>2.写css.ceshi{ height: 100px; width: 710px; line

2020-12-06 22:04:04 6477 2

原创给网页添加背景图片 html+css

标题：给网页添加背景图片 html+css项目场景：给网页添加背景图片，网页缩小放大都不受影响 html+css问题描述：给网页添加背景图片，网页缩小放大都不受影响，解决方案：1.在html写入一个div盒子<div class="bjimg"></div>2.写css代码.bjimg { position: fixed; top: 0; left: 0; width: 100%; height: 10

2020-12-06 21:33:39 28828 8