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>To mark a style as important, use the |important modifier:
<div style:color|important="red">...</div>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>previous next