Fork me on GitHub

JackLin的博客

当前位置:首页 > 标签

SpringBoot 14 Spring 2 SpringMVC 3 MyBatis 2 Linux 4 阿里云 13 宝塔 1 Docker 3 ElasticSearch 2 Redis 4 Shiro 0 Dubbo 0 Swagger 0 Thymeleaf 6 数据库 11 MySQL 11 外键 2 Gradle 1 Test 0 Tomcat 1 JavaWeb 7 Ajax 1 注解 3 css 2 报错 3 多数据源 1 Java基础 1 源码 2 Servlet 1 JSP 1 环境搭建 8 RabbitMQ 1 七牛云 1 Edit.md 1 图像识别 4 英语 2 Zookeeper 1

网页背景动态线条跟随鼠标焦点效果

  • 2020-05-16
  • 141
  • 前端设计
发现很多网站的背景都有一个类似的动态效果,就是网站的背景中有很多动态的线条,当鼠标移动过去时,线条会吸附在鼠标的焦点上。 效果图如下所示: ![](http://image.linkaiblog.top/背景线条_2020051608512951SS.png) 然后上网搜了一下,发现了 1 种解决方案 ### 解决方案1:github上的开源项目 我在 github 找到了一个类似的开源项目。 项目地址:https://github.com/hustcc/canvas-nest.js 这个项目有中文 ReadMe 文档,十分友好,而写文档也写的十分详细。 ![](http://image.linkaiblog.top/背景线条_2020051608474847SS.png) 由于我们只是简单的使用,所以只需要引入 dist 目录下面的 canvas-nest.js 文件即可。 效果就是我文章开头的截图所示的效果 **同时,如果觉得不错的话,记得给该项目点个 star 哟!** ![](http://image.linkaiblog.top/背景线条_2020051608365436SS.png)

CSS实用技巧

  • 2020-04-14
  • 130
  • 前端设计
### 概述 这篇文章主要记录一些使用的前端 css 技巧,知识点可能很零散,但都是一些实用的技巧。一直更新中... #### 1.让div的高度随着内容的高度改变而改变 ``` div { border: 1px solid #dee2e6 !important; } // 同样也可适用于表格中的 td,th ``` #### 2.让div水平排列 #####(1)设置浮动 float:left ``` div { float:left } ``` #####(2)设置 display:inline-block ``` div { display: inline-block } ```