首页 > 其他分享 >CSScomb配置

CSScomb配置

时间:2024-02-26 18:22:37浏览次数:23  
标签:box flex align 配置 ms webkit CSScomb font

1.问题

在配置使用CSScomb时,
无论是使用官方提供的 "yandex" ,会出现所有项均顶头显示

链接yandex.json

还是在网上找的一些配置,无法忽略一些无需配置的文件,且不能按我的需求:比如像width,height等必须在background-color的前面这些

2.解决

参考了一下yandex.json的代码,将二者一结合就成了!!!

  // csscomb为css排序
  // csscomb 保存时,为css排序
  "csscomb.formatOnSave": true,
  // 使用自定义排序风格, 官方推荐的三个: csscomb、yandex、zen
  "csscomb.preset": {
    "exclude": [
      // 排除指定文件或文件夹下的 CSS 文件
      ".git/**",
      "node_modules/**",
      "bower_components/**"
    ],
    "sort-order": [
      // 定义 CSS 属性的排序规则
      [
        // 第一个排序规则:定位属性
        "position",
        "z-index",
        "top",
        "right",
        "bottom",
        "left"
      ],
      [
        // 第二个排序规则:显示属性
        "display",
        "visibility",
        "float",
        "clear",
        "overflow",
        "overflow-x",
        "overflow-y",
        "-ms-overflow-x",
        "-ms-overflow-y",
        "-webkit-overflow-scrolling",
        "clip",
        "zoom",
        "-webkit-align-content",
        "-ms-flex-line-pack",
        "align-content",
        "-webkit-box-align",
        "-moz-box-align",
        "-webkit-align-items",
        "align-items",
        "-ms-flex-align",
        "-webkit-align-self",
        "-ms-flex-item-align",
        "-ms-grid-row-align",
        "align-self",
        "-webkit-box-flex",
        "-webkit-flex",
        "-moz-box-flex",
        "-ms-flex",
        "flex",
        "-webkit-flex-flow",
        "-ms-flex-flow",
        "flex-flow",
        "-webkit-flex-basis",
        "-ms-flex-preferred-size",
        "flex-basis",
        "-webkit-box-orient",
        "-webkit-box-direction",
        "-webkit-flex-direction",
        "-moz-box-orient",
        "-moz-box-direction",
        "-ms-flex-direction",
        "flex-direction",
        "-webkit-flex-grow",
        "-ms-flex-positive",
        "flex-grow",
        "-webkit-flex-shrink",
        "-ms-flex-negative",
        "flex-shrink",
        "-webkit-flex-wrap",
        "-ms-flex-wrap",
        "flex-wrap",
        "-webkit-box-pack",
        "-moz-box-pack",
        "-ms-flex-pack",
        "-webkit-justify-content",
        "justify-content",
        "-webkit-box-ordinal-group",
        "-webkit-order",
        "-moz-box-ordinal-group",
        "-ms-flex-order",
        "order"
      ],
      [
        // 第三个排序规则:尺寸属性
        "-webkit-box-sizing",
        "-moz-box-sizing",
        "box-sizing",
        "width",
        "min-width",
        "max-width",
        "height",
        "min-height",
        "max-height",
        "margin",
        "margin-top",
        "margin-right",
        "margin-bottom",
        "margin-left",
        "padding",
        "padding-top",
        "padding-right",
        "padding-bottom",
        "padding-left"
      ],
      [
        // 第四个排序规则:表格属性
        "table-layout",
        "empty-cells",
        "caption-side",
        "border-spacing",
        "border-collapse",
        "list-style",
        "list-style-position",
        "list-style-type",
        "list-style-image"
      ],
      [
        // 第五个排序规则:其他属性
        // 这里是一些与文本、样式和效果相关的属性,以及一些兼容性的属性
      ],
      [
        // 第六个排序规则:字体属性
        "font",
        "font-family",
        "font-size",
        "font-weight",
        "font-style",
        "font-variant",
        "font-size-adjust",
        "font-stretch",
        "font-effect",
        "font-emphasize",
        "font-emphasize-position",
        "font-emphasize-style",
        "font-smooth",
        "line-height"
      ]
    ],
    "remove-empty-rulesets": true, // 移除空的 CSS 规则集
    "always-semicolon": true, // 总是在声明末尾添加分号
    "color-case": "upper", // 颜色值转换为大写
    "block-indent": "  ", // 块级元素的缩进为两个空格
    "color-shorthand": false, // 不使用颜色值的简写形式
    "element-case": "lower", // HTML 元素选择器转换为小写
    "eof-newline": true, // 在文件末尾添加换行符
    "leading-zero": false, // 移除小数点前面的数字中不必要的零
    "quotes": "single", // 使用单引号
    "sort-order-fallback": "abc", // 按字母顺序对属性排序
    "space-before-colon": " ", // 冒号前添加一个空格
    "space-after-colon": " ", // 冒号后添加一个空格
    "space-before-combinator": " ", // 组合器前添加一个空格
    "space-after-combinator": " ", // 组合器后添加一个空格
    "space-between-declarations": "\n", // 在声明之间添加换行符
    "space-before-opening-brace": " ", // 左大括号前添加一个空格
    "space-after-opening-brace": "\n", // 左大括号后添加一个换行符
    "space-after-selector-delimiter": " ", // 选择器分隔符后添加一个空格
    "space-before-selector-delimiter": "", // 选择器分隔符前不添加空格
    "space-before-closing-brace": "\n", // 右大括号前添加一个换行符
    "tab-size": true // 使用制表符进行缩进}
  }

标签:box,flex,align,配置,ms,webkit,CSScomb,font
From: https://www.cnblogs.com/trmbh12/p/18034910

相关文章

  • Python + Apollo 实现配置中心
    --coding:utf-8--importjsonimportosimportthreadingimporttimefromdatetimeimportdatetime,timedeltafromtypingimportOptionalimportrequestsimportLogConfigasloggingclassApolloClient(object):definit(self,app_id,cluster='defaul......
  • GB28181视频监控平台EasyCVR如何通过配置实现级联不响应下级平台的检索消息?
    AI视频智能分析/视频监控管理平台EasyCVR能在复杂的网络环境中(专网、内网、局域网、广域网、公网等)将前端海量的设备进行统一集中接入与视频汇聚管理,平台支持设备通过4G、5G、WIFI、有线等方式进行视频流的快捷接入和传输。平台能将接入的视频流进行汇聚、转码与多格式分发,可分发......
  • gin环境&路由配置
    Gin是一个Go(Golang)编写的轻量级httpweb框架,运行速度非常快Gin的官网:https://gin-gonic.com/zh-cn/GinGithub地址:https://github.com/gin-gonic/gingin环境搭建下载并安装#gomod同级目录下goget-ugithub.com/gin-gonic/gin......
  • Android 多渠道配置
    Android多包名,icon本篇文章主要记录下android下的同一工程,打包时配置不同的包名,icon,名称等信息.1:多包名首先讲述下如何配置多包名.在build.gralde的android标签下添加:productFlavors{xiaomi{applicationId"com.test.usagetest"}......
  • umijs 项目配置问题汇总
    umi配置问题汇总umi或@umijs/max集成tailwindcss正常umi内置了tailwindcss插件,详情可参考官方文档TailwindCSS配置生成器但是由于内置的tailwindcss插件过老,umi官方已不推荐使用内置,建议使用tailwindcss官方的配置。详情可见issue同时,umi官方也不推荐使用p......
  • springBoot 整合 groovy 实现表达式解析 该示例可以用于配置告警规则
    1.引入pom<dependency><groupId>org.codehaus.groovy</groupId><artifactId>groovy</artifactId><version>3.0.9</version></dependency><dependency......
  • 智能AI客服系统+企业专属AI知识库实现原理+配置教程
    企业专属AI知识库实现原理知识库是GPT用户咨询问题,调用文本转向量接口将问题转为向量数据,向量化搜索知识数据库,将相关知识文本整合后发送给GPT聊天补全接口 知识库服务主要基于以下两个接口:OpenAI聊天接口(/v1/chat/completions)OpenAI向量生成接口(/v1/embeddings......
  • 【架构师视角系列】QConfig配置中心系列之Client端(二)
    目录声明配置中心系列文章一、架构一、客户端架1、Server职责(1)配置管理(2)配置发布(3)配置读取2、Client职责(1)配置拉取(2)配置注入(3)配置变更监听3、基本交互流程(1)应用启动(2)配置变更通知(3)配置更新(4)配置注入二、架构思考三、源码剖析1、注解初始化1.1、逻辑描述1.2、时序图1.3、代码位置......
  • ROS2 humble交叉编译环境配置
    目录配置toolchain文件:库文件交叉编译指令:问题点:1、find_package找不到自定义依赖包的问题2、libarmadillo.so.10:undefinedreferenceto`xxx'3、/usr/bin/moc找不到直接上干货,本文将介绍配置ROS2的交叉编译环境编译平台:x86ubuntu22.04目标平台:armv8ubuntu22.04ROS2......
  • 【问题记录】【Apollo】修改业务配置参数需要重启服务么?
    1 前言最近发现小伙伴对于修改参数,要不要重启不太清楚,整的我都怀疑自己的认知了,我记得看Apollo源码的时候,它有个后置处理器,会收集哪个类的哪个属性需要注入,然后当配置变更的时候,会通过反射设置新的值的,这节我就来带大家看看。首先对于服务参数或者系统参数,比如端口、数据源......