适当的条件样式方式

Question

这是元素的条件样式的正确方法吗？在Chrome上运行得很好，遗憾的是在其他浏览器上没有，但在我看来，这是非常容易和很好的方式。

<template if="{{data.Reply}}">
        <style>
            :host {
                background: #1ba1e2;
                right: 100px;
            }
        </style>

    </template>
    <template if="{{!data.Reply}}">
        <style>
            :host {
                background: #33C03A;
                left: 100px;
            }
        </style>
    </template>

<style>
        :host {
            ....
        }
</style>