- 博客(100)
- 收藏
- 关注
RSS订阅原创 vue3之echarts markLine自定义
效果如下：<template>// 自定义的两张markLine图片xAxis: ['考核点1', '考核点2', '考核点1', '考核点1', '考核点1', '考核点1', '考核点1', '考核点1', '考核点9', '考核点10', '考核点11', '考核点12'],list: [name: '红',value: 90,},name: '红',value: 86,},name: '红',value: 80,},name: '红',value: 75,
2025-03-10 16:48:20
137
原创 border-image详解
属性允许开发者使用图片来定义元素的边框，替代了传统的纯色边框。这个属性实际上是一个简写属性，聚合了多个子属性，包括用于定义图片源、切片方式、边框宽度、外扩以及平铺模式的设置。下。
2024-08-20 16:34:09
1113
原创 CSS动画详解
CSS动画（Cascading Style Sheets Animations）是一种利用CSS语言实现的网页元素动态效果技术。它允许开发者在不依赖JavaScript的情况下，通过简单的声明式语法创建丰富的视觉过渡效果。
2024-05-23 11:01:59
1229
原创 text-stroke详解
属性是用来为文本添加描边效果的CSS属性，但请注意，它并非标准CSS属性，而是WebKit（如Safari和Chrome）浏览器专有的CSS扩展属性。为了兼容其他浏览器，通常会配合 -webkit-text-stroke 和 -moz-text-stroke 等私有前缀属性一起使用。
2024-04-17 17:24:50
1399
原创 text-shadow详解
是CSS3中用于给文本添加阴影效果的属性。它允许您为文本内容添加一个或多个阴影，以增强视觉效果，创建立体感或装饰性文字外观。
2024-04-17 16:53:51
7027
原创 background-blend-mode属性详解
background 是一个复合属性，它可以合并多个背景相关的子属性，如 background-color、background-image、background-repeat、background-position、background-size 等。而 background-blend-mode 是独立于 background 的另一个属性，专门用于控制背景层间的混合模式。是CSS中的一个属性，用于控制一个元素的背景图层（如果有多个背景图像）如何与背景颜色或其下层内容混合在一起。
2024-04-15 17:37:56
1835
原创 background-image渐变详解
属性不仅可以用来设置背景图片，还可以用于创建线性渐变（linear gradients）和径向渐变（radial gradients）背景。这个例子创建了一个从中心向外扩展的圆形径向渐变，起始颜色为红色，中间转为半透明黑色，最外圈为蓝色。线性渐变是从起点到终点沿着一条直线逐渐过渡的一种颜色或透明度的变化。这将创建一个从左到右的渐变，开始为红色，到达一半时变为黄色，剩余部分为绿色。径向渐变是从一个中心点向外围扩散的颜色或透明度的变化。
2024-04-15 14:55:08
3779
原创 background详解
background是 CSS 中的一个复合属性，用于设置元素的背景样式，包括颜色、图像、位置、大小、重复方式等。它可以简化为单独的背景属性，也可以一次性设置多个背景属性值。以下是background。
2024-04-12 10:32:25
3438
原创 CSS自定义鼠标样式
属性值属性描述url需使用的自定义光标的 URLdefault默认光标（通常是一个箭头）auto默认。浏览器设置的光标crosshair光标呈现为十字线pointer光标呈现为指示链接的指针（一只手）move此光标指示某对象可被移动e-resize此光标指示矩形框的边缘可被向右（东）移动ne-resize此光标指示矩形框的边缘可被向上及向右移动（北/东）nw-resize此光标指示矩形框的边缘可被向上及向左移动（北/西）n-resize。
2023-02-16 16:12:33
1682
原创 CSS3 animation-fill-mode详解
属性规定当动画不播放时（当动画完成时，或当动画有一个延迟未开始播放时），要应用到元素的样式。默认情况下，CSS 动画在第一个关键帧播放完之前不会影响元素，在最后一个关键帧完成后停止影响元素。属性可重写该行为。
2023-02-15 16:49:29
3473
原创 CSS单位之vw、vh、vmin、vmax、%
视窗(Viewport)是指浏览器内部的可视区域大小，即window.innerWidth/window.innerHeight大小，不包含任务栏标题栏以及底部工具栏的浏览器区域大小。position:absolute时，将相对于其相对的元素宽度（递归父元素直到第一个设置了position的元素）。注意：position:fixed时，无论当前元素放在哪里，将相对于窗口宽度。1vh 等于1/100的视窗高度，1vw 等于1/100的视窗宽度。下面通过一个例子来说明。下面是用一个例子来说明。
2023-02-14 11:01:52
4028
原创 filter及backdrop-filter属性详解
属性定义了元素(通常是)的可视效果(例如：模糊与饱和度)。作用于元素本身属性可以让你为一个元素后面区域添加图形效果（如模糊或颜色偏移）。因为它适用于元素背后的所有元素，为了看到效果，必须使元素或其背景至少部分透明。作用于元素背后的区域所覆盖的所有元素。它最常用的功能就是毛玻璃效果。下面运用一个例子来对比效果：效果如下图：效果如下图：那么我们再写一个例子来谈谈以及的不同：效果如下：所以， 作用于当前元素，并且它的后代元素也会继承这个属性； 作用于元素背后的所有元素。最后，有两个他们的相同
2023-02-10 16:51:36
2836
原创 canvas之刮刮乐
说到刮刮乐，先让我们了解一下canvas合成。效果如下：效果如下（画出的矩形只显示路径在圆形里的）：效果如下：在这里插入图片描述全局合成示例之刮刮乐：效果如下：参考链接
2022-10-11 17:52:01
632
原创 Node Sass version 7.0.3 is incompatible with ^4.0.0
版本出现了问题，或者依赖的环境不对。可以在相关网站上看到以下版本依赖信息（，经过某些操作后，又会发现报其他的错，如。那么根据对应的node版本安装合适的。运行项目时，发现报错。
2022-10-10 14:38:23
8186
原创 SASS详解
程序监测，目录下的所有scss/sass源文件都会被编译，但通常不希望局部文件被编译，因为局部文件是用来被导入到其他文件的。一般适用于通过@import导入的sass库文件，可以定制修改sass库文件中的某些值。一般我们都将变量当做属性值来使用， 但是也有极特殊情况下我们会将变量当做。文件时就把相关文件导入进来。源文件，被导入的文件就是局部文件，局部文件让。用法基本一致，只不过写法不同。文件中，而无需发起额外的下载请求。那就代表这个是当前变量的默认值。的混合器实现大段样式的重用。开头来命名这些文件。
2022-10-09 15:45:37
363
原创 html转canvas创建Marker
在之前的项目中，需要实现Marker不穿墙的问题，这个可以采用canvas的方式来实现，但是呢，有的一些建筑顶牌不止是单纯的建筑名称，还需要有一些其他的数据展示，甚至有可能是表格，这个时候使用canvas去画出这样的页面，就有一些耗费时间了。这样就可以大大的加快速度。:读取网页上的目标DOM节点的信息绘制成canvas，但需要注意的是，它不支持一些CSS3的属性，这个可以参考。那么我们在项目中，如何在vue中使用它，来达到我们的目的呢？其次，我们需要一个vue组件，以下简单举例，接收一个参数。
2022-10-08 17:10:20
658
原创 vue3 teleport的使用
官网介绍：Renders its slot content to another part of the DOM,翻译过来就是将其插槽内容呈现给。元素，来存放它，这样会比较的麻烦。有时候它可能会被父元素的样式影响，所以我们可以使用。但此时呢，我们还需要手动去创建一个。完成渲染之前，手动创建一个。使用之后便已经在另一个单独。完整代码如下(其中使用了。被外层父组件样式影响。（组件还没完成渲染，在。节点）中去创建节点。......
2022-08-10 14:11:39
589
原创 通过webkitAnimationEnd实现轮播动画
我们也常常通过它来实现大部分轮播动画，但有时候项目比较简单，以及一些版本的问题，我们可以尝试一些其他简单的手段来实现轮播。那我们在实现轮播逻辑时，可以利用CSS3的动画属性结合其监听来实现。事情，打印出“执行完一次animation”的字样。在WebKit引擎的浏览器中，当CSS3的。事件，监听重复运动事件，每执行完一次。'执行完一次animation'相对应，一个是开始，一个是结束。说到轮播动画，大家应该都知道。在以下示例中，当执行完一次。动画执行结束时，会触发。动画，控制台就会触发。......
2022-08-09 14:45:29
659
原创 CSS实现文字跑马灯效果
* 最外层盒子，需要三个属性：定宽、文字不换行、超过隐藏 *//* 让前面的几个文字有一个初始的距离，达到更好的呈现效果 */在完成一个任务的时候，要求在表格中固定宽度的其中一个。/* 盒子背景宽度将随文字宽度而进行自适应 *//* 添加动画 */
2022-08-09 10:30:45
6170
原创 修改css默认滚动条样式
以下代码的共同如下：滚动条整体部分内层滚动轨道会覆盖 的样式。滚动滑块以下为竖状滚动条简单示例：以下为横向滚动条简单示例：
2022-08-08 16:29:33
495
原创 更改ElementPlus默认样式的方法
需要注意的是，这里修改的样式是。仅修改当前组件下的样式。中下入以下代码即可生效。也可以定义公共的外部。
2022-08-08 14:20:10
15141
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人