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
属性结合使用时,指令将优先:
¥When style:
directives are combined with style
attributes, the directives will take precedence:
<div style="color: blue;" style:color="red">This will be red</div>