css 选择器(路径较深)没起作用?

深度选择器的使用 - 解决溢出被隐藏

PrimeNG Table 下拉组件被隐藏

  • Angular 项目中使用了 PrimeNGTable 组件,带有调整列宽功能的同时行内编辑中使用了下拉组件,但是由于 overflow 属性的设置(官方默认的样式)导致下拉组件被隐藏了
  • 项目在线地址是:https://stackblitz.com/github...
  • 项目打开后看右边有依赖需要安装,安装后即可看到效果
  • 打开项目后左侧选择 PrimeNG Table,右边上面表格的列 Brand 的下拉组件是正常的,下面表格的不正常

解决方法

  • 下拉组件被隐藏是由于两个地方的 overflow 设置了 hidden ,将这两处的 overflow 注释掉,下拉组件即可显示(下图是下面表格在 console 中的代码)

    图片描述

我的问题

  • 我将上面两处的 overflow 属性写在 css 文件中没有起效果,看 css 代码:

    /* 下面两个设置是取消溢出隐藏,以便在有列宽调整功能的同时显示下拉组件 */
    .ui-table-resizable>.ui-table-wrapper {
        overflow: visible !important;
    }
    
    .ui-table-resizable .ui-table-thead>tr>th, .ui-table-resizable .ui-table-tfoot>tr>td,
    .ui-table-resizable .ui-table-tbody > tr > td {
        overflow: visible !important;
    }
  • css 中的选择器是从浏览器 console 中复制出来的,为什么没有起作用(看文件:ptable.component.css)?
  • 有必要的话:QQ = 409223171
阅读 558
评论 2019-07-19 提问
    1 个回答

    已经解决了,及时来更新状态

    评论 赞赏
      撰写回答

      登录后参与交流、获取后续更新提醒