style:

style: 指令提供了一种在元素上设置多种样式的简写方式。

¥The style: directive provides a shorthand for setting multiple styles on an element.

<!-- These are equivalent -->
<div style:color="red">...</div>
<div style="color: red;">...</div>

该值可以包含任意表达式：

¥The value can contain arbitrary expressions:

<div style:color={myColor}>...</div>

允许使用简写形式：

¥The shorthand form is allowed:

<div style:color>...</div>

可以在单个元素上设置多种样式：

¥Multiple styles can be set on a single element:

<div style:color style:width="12rem" style:background-color={darkMode ? 'black' : 'white'}>...</div>

要将样式标记为重要，请使用 |important 修饰符：

¥To mark a style as important, use the |important modifier:

<div style:color|important="red">...</div>

当 style: 指令与 style 属性组合使用时，指令将优先执行，甚至优先于 !important 属性：

¥When style: directives are combined with style attributes, the directives will take precedence, even over !important properties:

<div style:color="red" style="color: blue">This will be red</div>
<div style:color="red" style="color: blue !important">This will still be red</div>