简写 CSS 转换为详细 CSS 的工具或方法？

Question

有没有通用的工具或者方法可以把简写的css 转换成原始的css 比方说 border： 1px solid red 可以转换成 border-width： 1px； border-style： solid； border-color： red；

Answer 1

https://github.com/johno/postcss-shorthand-expand

这个或许就是你想要的东西吧

Answer 2

• ask： border： 1px solid red 帮我转换成 详细的css

Sure, here is the detailed CSS:

{
    border-width: 1px;
    border-style: solid;
    border-color: red;
}

github copilot 的回答

Answer 3

自己用js写一个啊

function transformBorderStyle(borderStyleString){
    const a = document.createElement('a')
    a.style.border = borderStyleString
    const { borderWidth,borderStyle,borderColor } = a.style;
    return `border-width: ${borderWidth};border-style: ${borderStyle};border-color:${borderColor};`
}