花椒和蕊的博客

【css拾遗】粘性布局实现有滚动条的情况下，按钮固定在页面底部展示

grid-column-start/grid-column-end/grid-row-start/grid-row-end：用于定义单个网格元素的起始位置和结束位置。grid-template-columns/grid-template-rows：用于定义网格的列和行的大小和数量。grid-auto-columns/grid-auto-rows：用于定义没有显式指定大小的网格的列和行的大小。grid-column-gap/grid-row-gap：用于定义网格的列间距和行间距。

【代码】【css】字体渐变色，边框渐变色等笔记，按钮渐变色等持续更新~~

项目中使用了大量的svg图标，一开始只是导入直接使用，直到产品提出要根据条件修改图标的颜色。SVG 意为可缩放矢量图形，SVG 使用 XML 格式定义图像。关于这个fill属性，大概的解释是fill 属性设置形状内的颜色。在style中有个fill对应的颜色就是svg的图标颜色。需要改颜色的话，要在svg图标的内部，把这个类名改成这样。然后再加一个svg类名，path上的类名不用动。导入项目的svg图标大概是这样。可以简单看下教程了解下svg。有个path路径，并且有类名。在页面上通过v-if控制。

第一和第二列使用了fix属性固定列，因为是可编辑表格，使用插槽放了输入框后，要调整样式，要让输入框占满单元格。就会遇到一个问题，表格自带的vxe-cell类名，有个左右间距各10px。如果不清除的话，表格就会变成这样，两边的间距导致我们自己设的背景色占不满。如果直接deep深度改样式，就会遇到一开始的问题，表头少了下边框线。原先是这么写的，这样写的问题就是整个表格都被清除了左右间距。审查元素后，确实是这样vxe-table的左右间距导致的。换成下面这样，问题就解决了，只有表身清除。

效果如下：鼠标移过有个高亮的效果。