在CSS中，calc()函数用于执行数学运算，它可以在CSS属性中计算值。calc()函数允许你使用加减乘除等数学操作符来组合不同类型的长度、百分比、视口单位和数值，生成最终的计算结果作为CSS属性的值。
以下是calc()函数的一些常见用途和作用：
动态计算长度值：calc(...
yekong
1年前 (2023-07-19)
喜欢
vue3 数据可视化大屏项目开发过程中，需要设置多个背景图，但是设置完成后发现背景图重复了。
多个背景图
background-image: url('./assets/searchbgleft.png'),
url('./assets/searchbg.png'),
url(...
yekong
1年前 (2023-07-19)
喜欢
效果截图
效果动画
要在CSS中实现PNG图片的动态切换效果，你可以使用CSS动画和背景图像切换的技术。下面是一种常见的实现方法：
HTML结构：
<div class="image-container"></div>
CSS样式...
yekong
1年前 (2023-07-10)
喜欢
要实现文字自上而下的颜色渐变效果，可以使用 CSS 的背景渐变（background gradient）和文本渐变（text gradient）的组合。以下是一个示例代码，展示了如何实现文字的自上而下颜色渐变效果：
<div class="gradient-tex...
yekong
1年前 (2023-06-29)
喜欢
要通过CSS设置输入框（input）的占位符（placeholder）文本的颜色，可以使用::placeholder伪元素选择器。这样你可以指定占位符文本的颜色。
以下是一个示例，展示如何使用CSS设置输入框占位符文本的颜色：
input::placeholder {
col...
yekong
1年前 (2023-06-28)
喜欢
网页开发中，因为篇幅问题，需要显示两行文本，超出的部分就隐藏了。这里将实现代码记录下来。
关键代码
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-...
yekong
1年前 (2023-06-17)
喜欢
数据大屏项目开发中，为了让页面更生动，或增加一些特效，这里我们使用css来实现从左到右的扫光效果。
html
<div class="body_center_top_list_item">
<div class="xg"...
yekong
2年前 (2023-05-18)
喜欢
最近在做数据可视化大屏的时候，有一个项目里面有很多线条，并且线条是倾斜的，想通过css的方式来实现，rotateZ，但是这种旋转有一个问题，是以div的中心点为旋转中心的，我希望是以div左上角为中心点，所以需要调整一下。
transform: rotateZ(10deg);
...
yekong
2年前 (2023-03-28)
喜欢
在数据可视化大屏 项目中，经常会遇到下图这样的底座，一直在想如何实现让他旋转的动画呢？今天看到一个数据可视化大屏案例，学到了，通过css3就可以完成。
html
<div class="cicle3">
</div>
css
.c...
yekong
2年前 (2023-02-19)
喜欢
在很多项目中我们需要在div上增加一层蒙版，但是又不想这层蒙版影响我们的点击实现，又或者需要在地图前面加一些内容，但又不想让这些内容影响我们点击地图，这时候需要css实现穿透点击。
pointer-events 属性用于设置元素是否对鼠标事件做出反应。
pointer-event...
yekong
2年前 (2023-01-30)
喜欢
