java - VaadinFlow 中的样式网格

Question

我尝试通过 shared-styles.html (webapp/frontend/styles) 更改 Vaadin Flow Grid 标题的背景颜色：

<custom-style>   
    <style>

        <dom-module id="my-grid" theme-for="vaadin-grid">
            <template>
                <style>
                    [part~="header-cell"] {
                        background-color: blue;
                    }
                </style>
            </template>
        </dom-module>

    </style>
</custom-style>

对应于https://github.com/vaadin/vaadin-themable-mixin/wiki/3.-Stylable-Shadow-Parts和https://vaadin.com/components/vaadin-grid/html-api/elements/Vaadin .GridElement这应该可以工作 - 但它没有......

怎么了？

Answer 1

<dom-module>不应该在or<style>标记内<custom-style>，而是在它旁边。另外，背景颜色好像默认会被覆盖，所以你可以尝试添加!important后进行测试。对我来说，设置th[part~="header-cell"]似乎足够具体，不会被覆盖。

<custom-style>
    <style>
    </style>
</custom-style>

<dom-module id="my-grid" theme-for="vaadin-grid">
    <template>
        <style>
            th[part~="header-cell"] {
                background-color: darkorange;
            }
        </style>
    </template>
</dom-module>