jjw_zyfx的博客

vue3 css实现文字输出带光标显示,当文字输出完毕，光标消失

vue css 实现类似游戏中的模糊圈游走的感觉

css 实现呼吸灯效果

css 动画实现从中间到两边亮度逐渐变暗的流水灯效果

当鼠标放在图片上时，在图片上显示微动的效果

css 下拉框展示：当hover的时候展示下拉框

vue 使用useWindowScroll实现首页布局中的吸顶效果

css 中 ~ 符号的使用

【代码】Vue使用flex将图片并排居中且左对齐。

给一个字符中的img标签添加图片预览功能，Vant组件、ref和querySelector两种方式实现

postcss-pxtorem 参数之selectorBlackList、exclude的用法

/ 要高亮显示的部分constref'jjw'// 要替换成的样式constref''// 替换后的结果constref''// 要替换的原字符串constref'jjw你好啊，Jjw咋样呀，JJw可别压力太大了'consthighLight=>// 'gi':g全部替换，i忽略大小写，constnewRegExp。

css flex: unset的使用

vue flex导航条，子元素一行显示，超出滚动，且不显示overflow的滚动线，最右侧固定定位一个子元素实现细节

vue中iconfont的几种使用方式详解

vue vant遮罩弹窗但不覆盖公司logo的一种做法

vue使用v-bind绑定样式

css当中appearance: none;border: none;outline: none;的区别

vue 中less样式混入(mixin)或者使用别人的样式的几种用法

多张图片做旋转透视的动画、perspective、animation: rotate、animation-play-state、transform、transform-style

background-image: linear-gradient(to top, red, transparent 80%)中的各参数解释

css中background: lighten的用法

vue3中引入初始化样式

【代码】vue3中使用less简直太简单了。

这样使用vh会出现滚动条，不是我要的代码如下：<template> <div> <div class="wrapTitle">一般的后端都有的title，这些高度一般是固定的</div> <div class="wrapContent"> 这个一般是下边的内容的，现在用来测试CSS中的vh并使用calc进行计算</div> </div></template><script

效果如下：代码如下：<template> <div class="wrapHeader"> <div class="buttonClick" @click="showMask">显示</div> <van-overlay :show="show" @click="show = false"> <ul class="ulLi"> <li&g..

<van-checkbox v-model="checked" class="check-box-info" shape="square" checked-color="#FFDA99" icon-size="12px"> <div class="agreement"> &nbsp;&nbsp;&nbsp;我已阅读并同意<span class="under-line" @click.stop="agreement(0...

例如：注意 background-size 设置的属性要和前边有一个 / 隔开，否则会语法报错。# 再补充一个 background-size。

vue 版本1.首先安装这俩npm i less-loader less --save-dev注后续可能会出错，因为会出现less-loader版本高而报错所以可以分开安装即npm i less --save-devnpm install -D less-loader@7.x2 安装完成后使用 lessc -v查看版本如果能出现版本信息，则说明没问题否则可能出现如下问题解决方法：npm install less -gnpm install less-plugi

a{background-color:white;display:block;width:100px;height:80px;position:relative;margin:0auto;}a::after{content:"";position:absolute;...

没点击的时候点击完后的样子：代码：<template> <div class="app"> <div class="box" > <div class="box1" :style="{height : isTrue ? '200px':'auto'}" @click=...

.ivu-modal{ position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; }但是你会发现有闪动的效果，所以说iview真是lj...

代码：<template> <div id="app"> <input type="button" value="toggle" @click="flag=!flag"> <input type="button" value="toggle2" @click="flag2=!flag2"> <!-...

其他也是这样的 /deep/可参考下边的博客https://blog.youkuaiyun.com/jjw_zyfx/article/details/102422072如果/deep/不起作用可以用这种方式即再添加一个不写scoped的style这个style中的所有样式都是全局样式这样就可以显示了...

效果：没有模糊值的效果：效果：效果：效果：效果：