Js-beautify: 添加选项以在 CSS 中保留单行规则

创建于 2017-12-03 · 4评论 · 资料来源: beautify-web/js-beautify

描述

问候！

如果我有这个
footer { padding: 1%; }

然后在 Shift+Alt+FI 之后得到

    footer {
        padding: 1%;
    }

是否可以选择保持“单行规则”不变？

试过

"beautify.options": {"brace_style": "collapse,preserve-inline"}

但没有运气

设置

 {
    "window.zoomLevel": -1,
    "workbench.sideBar.location": "right",
    "files.autoSave": "afterDelay",
    "files.autoSaveDelay": 1000,
    "editor.cursorStyle": "underline",
    "liveServer.settings.donotShowInfoMsg": true,
    "liveServer.settings.donotVerifyTags": false,
    "html.format.contentUnformatted": "pre,code,textarea,li",  
}

css blocked enhancement

资料来源

Gennady-G

👍3 ❤1

最有用的评论

也许它应该是一个像max_preserve_single_line_properties这样的选项，配置了最大数量的属性以保留在一行中。

格式化：

.fill {
    flex: 1 1 auto;
}

.item-name input {
    font-size: 1.5em;
}

.avatar {
    border-radius: 50%;
    margin-right: 10px
}

.avatar-32 {
    width: 32px;
    height: 32px
}

.avatar-64 {
    width: 64px;
    height: 64px
}

.avatar-100 {
    width: 100px;
    height: 100px
}

.avatar-128 {
    width: 128px;
    height: 128px
}

.details {
    padding: 2em;
}

.form-actions {
    direction: rtl;
}

想要的结果：

.fill { flex: 1 1 auto; }
.item-name input { font-size: 1.5em; }

.avatar { border-radius: 50%; margin-right: 10px }
.avatar-32 { width: 32px; height: 32px }
.avatar-64 { width: 64px; height: 64px }
.avatar-100 { width: 100px; height: 100px }
.avatar-128 { width: 128px; height: 128px }

.details { padding: 2em; }
.form-actions { direction: rtl; }

kleber-swf 于 2018-04-01

👍6

所有4条评论

这与#1124 相关，但分开，因为它只要求保留单行规则。
目前两者都不在场。

bitwiseman 于 2017-12-04

👍1

谢谢@bitwiseman的回复！ :)

Gennady-G 于 2017-12-05

也许它应该是一个像max_preserve_single_line_properties这样的选项，配置了最大数量的属性以保留在一行中。

格式化：

.fill {
    flex: 1 1 auto;
}

.item-name input {
    font-size: 1.5em;
}

.avatar {
    border-radius: 50%;
    margin-right: 10px
}

.avatar-32 {
    width: 32px;
    height: 32px
}

.avatar-64 {
    width: 64px;
    height: 64px
}

.avatar-100 {
    width: 100px;
    height: 100px
}

.avatar-128 {
    width: 128px;
    height: 128px
}

.details {
    padding: 2em;
}

.form-actions {
    direction: rtl;
}

想要的结果：

.fill { flex: 1 1 auto; }
.item-name input { font-size: 1.5em; }

.avatar { border-radius: 50%; margin-right: 10px }
.avatar-32 { width: 32px; height: 32px }
.avatar-64 { width: 64px; height: 64px }
.avatar-100 { width: 100px; height: 100px }
.avatar-128 { width: 128px; height: 128px }

.details { padding: 2em; }
.form-actions { direction: rtl; }

kleber-swf 于 2018-04-01

👍6

这至少需要 css 标记化才能使其工作（#545）。一旦我们有了它，它将以与在 javascript 端相同的方式实现。

bitwiseman 于 2018-09-28

此页面是否有帮助？

0 / 5 - 0 等级

Js-beautify: 添加选项以在 CSS 中保留单行规则

描述

设置

最有用的评论

所有4条评论

相关问题