下雪效果只是一类效果的名称，可以是红包雨等一些自由落体的运动效果，本文就是用纯css模拟下雪的效果，更多效果大家可以自行发挥。 1.前言 由于公司产品的活动，需要模拟类似下雪的效果。浏览器实现动画无非css3和canvas（还有gif），对比下css3和canvas的优缺点： 动画自由度：canva ...
分类：
Web程序 时间：
2020-12-15 12:33:27
阅读次数：
4
一、css变量非全局 最近做项目，发现css变量一个有意思的特性，那就是变量作用域非全局。 举个例子，如下html和CSS： <div> <div>测试a</div> <div>测试b</div> <div>测试c</div> </div> .box { --color: red; color: v ...
分类：
Web程序 时间：
2020-12-15 12:26:37
阅读次数：
4
一、进入swiper官网，下载swiper框架，https://www.swiper.com.cn/ 二、创建项目 创建swiperdemo文件夹，在下面再分别创建css、js、images文件夹 三、从下载的swiper文件中把swiper-bundle.min.css和swiper-bundle ...
分类：
其他好文 时间：
2020-12-15 12:00:32
阅读次数：
1
css3选择器分类 CSS3选择器分类如下图所示 选择器的语法 1.基本选择器 类型 代码 功能描述 通配选择器 *{ margin: 0; padding: 0; border: none; } 选择文档中所有HTML元素 元素选择器 body { background: #eee; } 选择指定 ...
分类：
Web程序 时间：
2020-12-15 11:59:22
阅读次数：
3
一. 如何在Vue或React项目中使用自定义字体 在开发前端项目时，经常会遇到UI同事希望在项目中使用一个炫酷字体的需求。那么怎么在项目中使用自定义字体呢？ 其实实现起来并不复杂，可以借用CSS3 @font-face 来实现。 本文着重介绍一下 webpack 项目如何正确打包引入的自定义字体。 ...
分类：
Web程序 时间：
2020-12-15 11:50:34
阅读次数：
4
<html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> </head> <style> div{ transition: 0s background-color; } div:hover{ b ...
分类：
Web程序 时间：
2020-12-14 13:01:14
阅读次数：
6
项目介绍: 实现的页面效果: 前台页面: 后台管理页面: 以上的静态页面,通过 HTML结构 和 CSS样式 实现 而页面的交互由 JS 来实现 练习项目的目标: 1.了解真实项目开发的架构设计 （1）前端三层分离的编程思想 （2）网络请求层单独处理的编程思想 2.培养大家的项目思维能力 （1）独立 ...
分类：
其他好文 时间：
2020-12-14 12:53:50
阅读次数：
2
#1. 内联样式 不推荐 在标签内使用style属性指定css代码 hello css *** #2.内部样式 在head标签内 ，定义style标签 style标签的标签体内容就是css代码 页面 /*作用域为div*/ div{ color:blue; } #3.外部样式 定义css资源文件 2 ...
分类：
Web程序 时间：
2020-12-11 12:07:21
阅读次数：
7
解决给标签设置css样式不生效，开发者模式中被划掉问题。简而言之是因为css的优先级不够，被覆盖了。 ...
分类：
Web程序 时间：
2020-12-11 11:48:40
阅读次数：
15
字体类样式我们已经学习过字号font-size、字体font-family两个属性，接下来还有几个常用的字体属性。 粗细 font-weight: 作用：设置文字是否加粗显示。 属性名：font-weight，属于 font 属性的一个单一属性。 属性值有两种方式：单词类型、数字类型。 单词类型: ...
分类：
Web程序 时间：
2020-12-10 11:25:47
阅读次数：
10
