qq_35761056的博客

CSS的 filter: grayscale(100%);属性即可实现灰度效果 ，元素设置 filter: grayscale(100%) 属性整个元素里的内容全部显示黑白颜色，包含图片内容。之前也没做过这样的内容，第一感觉就是图片要重新设计黑白色，布局颜色都要修改。但看到好多网站瞬间变黑白色，感觉一定有更好的解决方法。后面才找到filter属性解决了。今天接到一个需求，老板要求小程序首页变成黑白色。

元素块重叠状态下 z-index 会让值大的元素块在顶层显示，元素块加上 transform 样式会让元素成为最顶层元素。这样会让 z-index 看起来没起到作用，实际上 z-index 值大的元素只是在 transform 元素的下一层。后面我放弃 transform 样式，使用 animation 解决了。

随后在data加入temp 变量。试了其他名称 tempss 好像也不起作用 ，只能使用 temp名称了。在样式里使用 var(变量名称) ，变量名称必须以 -- 开头 ，否则无效。如：var(--myfirst)变量名称和需要赋值的内容必须字符串包裹起来。如：temp: '--myfirst: 0px;最后一步需要在vue里面引入 temp 样式才会起作用。