元素边框未正确显示

Question

为什么下拉框的边框显示不正确？
似乎其他组件重叠，但是我不知道如何解决。

<div class="ui-g">
  <div class="ui-g-6 ui-md-6 ui-fluid">
    <label for="">Inicio Traslado:</label>  
    <p-dropdown [options]="" [autoWidth]="false"></p-dropdown>
     
  </div>
  <div class="ui-g-6 ui-md-6 ui-fluid ">
     
    <div class="ui-g ">
      <div class="ui-g-12 ui-md-12">
        <label for="">Fin Traslado:</label>
        <p-dropdown [options]="" [autoWidth]="false"></p-dropdown>
      </div>
      <div class="ui-g-12 ui-md-12 ">
        <label for="">Fecha autorización:</label>
        <p-dropdown [options]="" [autoWidth]="false"></p-dropdown>
      </div>
    </div>
  </div>
</div>

Answer 1

就像使用其他任何样式一样，只需使用CSS设置样式即可。使用控制台检查器确定CSS路径。

如果要使用CSS，则需要使用ng-deep。

或者，您可以将样式传递给基本组件。

后一种方法是首选方法，因为不建议使用ng-deep，但现在仍然可以使用。

或者您的第三个选择，只需使用全局样式表即可。

最后，请确保您选择了正确的引导程序版本-primeng支持3和4，但您必须选择其中一个。

component.css应该看起来像：

::ng-deep .your-class {
    color: red !important;
}