离子 4 如何更改：css 中的阴影 dom？答案

【问题标题】：ionic 4 how to change :shadow dom in css?离子 4 如何更改：css 中的阴影 dom？
【发布时间】：2019-09-28 07:08:01
【问题描述】：

离子选择的css问题，在阴影根中有一个按钮。我需要默认值 --padding-top:10px,--padding-end:8px,--padding-bottom:10px,--padding-start:16px ，但它是第一个元素并假定应用的值如下所示。

下图包含离子选择的颜色框，无法控制此框的大小。离子选择的代码如下。有人可以帮我吗？

<ion-col size="2" style="padding:0">
            <div class="colorselect color_{{color.slice(1,7)}}">

                <ion-select >
                  <ion-select-option (ionSelect)="selectColor(optioncolor)" *ngFor="let optioncolor of colors" [value]="optioncolor" >{{optioncolor}}
                  </ion-select-option>
                </ion-select>
            </div>
          </ion-col>

【问题讨论】：

标签： css angular ionic-framework sass ionic4

【解决方案1】：

试试这个包的 shadow-dom 元素。工作得很好。在 NPM 上搜索 Shadow-DOM-inject-styles。它可以让你设置阴影元素的样式

【讨论】：

【解决方案2】：

试试这个。它对我有用

ion-select{
    --padding-top:12px !important;
    --padding-end:12px !important;
    --padding-bottom:12px !important;
    --padding-start:20px !important;
}

【讨论】：