![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
css样式
星野丶Z
这个作者很懒,什么都没留下…
展开
-
马上过年了,5行代码教你实现放烟花
直接上代码吧 <!DOCTYPE html> <html lang="zh"> <head><title>Fireworks</title></head> <body> <div class="firework-container" ></div> <script src="./js/js/jquery-1.11.0.min.js"></script> <sc原创 2022-01-04 18:24:38 · 10035 阅读 · 11 评论 -
纯css实现tab导航栏pc和移动端适配效果
话不多说上代码,效果图放在最下面了 -html部分 <!DOCTYPE html> <html lang="en" dir="ltr"> <head> <meta charset="utf-8"> <title>Responsive Sidebar Menu</title> <link rel="stylesheet" href="style.css"> <meta name="v原创 2021-04-19 14:33:58 · 1022 阅读 · 0 评论 -
用面向对象语法写个放大镜
相信大家都买过东西吧,在查看产品详情的时候鼠标放在商品图片上会有一个放大效果,今天做的就是这个效果 首先分析一下: // "放大"镜:等比例移动 // 1. 选择元素 // 2. 补全布局:js获取不到页面上设置了display:none的元素的尺寸 // 3. 绑定事件 // 进入: // 4. 显示对应元素 // 离开 // 5. 隐藏对应元素 // 移动 // 6. 设置span的跟随鼠标 // 7. 计算比例 // 8. 根据比例计算右侧大图移动的距离 //原创 2020-08-11 16:29:35 · 207 阅读 · 0 评论 -
用代码写个烟花之基础版
今天用代码来写个烟花吧,先写个基础版的,后面的版本后续继续更新 下面上代码: 1、这是html+css <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</ti原创 2020-08-07 22:03:01 · 10444 阅读 · 4 评论 -
17个值得收藏的css形状
CSS能够生成各种形状。正方形和矩形很容易,因为它们是 web 的自然形状。添加宽度和高度,就得到了所需的精确大小的矩形。添加边框半径,你就可以把这个形状变成圆形,足够多的边框半径,你就可以把这些矩形变成圆形和椭圆形。 我们还可以使用 CSS 伪元素中的 ::before 和 ::after,这为我们提供了向原始元素添加另外两个形状的可能性。通过巧妙地使用定位、转换和许多其他技巧,我们可以只用一个 HTML 元素在 CSS 中创建许多形状。 虽然我们现在大都使用字体图标或者svg图片,似乎使用 CSS 来做原创 2020-08-06 16:38:50 · 190 阅读 · 0 评论