qq_39404437的博客

【vue】模板写法中用纯css实现左右拖拽效果resize-bar 这个类 overflow设置为scroll，并且左侧内容区宽度和滚动条dom宽度一致，以此来实现拖动控制宽度。因为不设置的话，主动调用折叠收缩将直接将另一侧宽度设置为0，那将无法将被折叠的dom再次拖拽了，当然此值可以根据你想要的来设置。因为不设置实际像素值的话，那拖拽滚动条的位置 只能在dom偏上方，而不能实现在滚动条任意位置拖拽。

将一个或多个样式规则生成在样式文件根层级上，而不是嵌套在其父选择器中，意思是 在sass/scss文件中，还是以前嵌套写法，但最后生成css样式文件时，会将@at-root 后面的样式 提到最高层级去。其实has内部可以根据你自己的需求来定义，它本身是伪类，当然可以和 :is, :not其他伪类一起搭配使用。父元素类型是div，然后它的直接子节点是 child，那么就修改它的样式为display: block;在日常开发中，我们知道子元素样式名，但是想修改父元素的样式，怎么办呢？

在vue里，js和css的属性可以随意控制，比如:class和:style，但是我们想要动态控制伪元素的属性该怎么做呢？比如下图，右下角小圆圈就是通过伪元素定义上去的，那我们想要自由实现伪元素的显示和隐藏该怎么做呢？那就可以通过var()函数可以代替元素中任何属性中的值的任何部分，想要具体了解的可以看官方文档噢~下面是链接。

去除最后一个子元素的伪元素，其含义也为不给最后一个子元素添加伪元素

element-ui内部各种组件的bug/样式的出现及bug解决方法

其实就是控制子组件在flex布局中的先后顺序，默认为0，可以为负，值越大布局越靠后，当值相等时，就根据写的先后顺序进行显示

webkit-scrollbar-track： 滚动条背景样式-webkit-scrollbar-thumb： 滚动条样式火狐的简单讲解一下，目前来看估计只能改这俩样式，宽度和颜色：scrollbar-width: auto | thin | none （默认为auto，宽度比较大，thin要窄一点，none为不显示，但是依旧可滚动）scrollbar-color：前者为滚动条样式，后者为滚动条背景样式。

用css画出三角形，多边形等有趣的样式

linear-gradient 实际就是渐变色，关于这个css属性，知识很多，我就把我学到的一点点东西给发出来。linear-gradient(angle, [...color])angle其实就是角度的意思，这个角度是啥呢？ 其实就是这个颜色开始变化时候的分界线，如下图：linear-gradient(45deg, #62c4ee, #169BD5, #62c4ee, #169BD5)等同于linear-gradient(to right top, #62c4ee, #169BD5,.

目前我看主流的都是用js来实现div拖拽效果，不过我个人觉得一直监听拖拽，会耗费很大的性能，毕竟监听盒子的宽高这些属性，都会触发浏览器的回流，并且我看了很多博客，他们是能用css实现div左右拖拽效果，但是并没有一个最小或者最大宽度的限制，导致直接将左右子div压扁。蓝色虚线是当鼠标移上去的时候，显示的拖拽线大多数博客的拖拽这种拖拽会将左div或者右div直接压扁，但是我肯定不想做成这样子，我想左div有最大和最小宽度限制，然后右div是自适应宽度我实现的拖拽左最小宽度，我.