PrimeNg TabMenu Angular 11:在右侧设置最后一个选项卡
Posted
技术标签:
【中文标题】PrimeNg TabMenu Angular 11:在右侧设置最后一个选项卡【英文标题】:PrimeNg TabMenu Angular 11: set last tab on the right 【发布时间】:2021-04-25 17:04:01 【问题描述】:我正在使用 Angular 11 和 PrimeNG 并使用 Flex 进行样式设置。
来自 PrimeNG 我现在正在使用 TabMenu。
现在想象一下,我想放置三个选项卡:选项卡 1、选项卡 2 和选项卡 3。我想在浏览器的左侧放置选项卡 1 和选项卡 2,而在右侧我只需要选项卡 3。
我正在使用下一个样式:
.p-tabmenu .p-reset
width: 100%;
display:flex;
justify-content: flex-start;
background-color: red !important;
flex-wrap: wrap;
还有李孩子:
.p-tabmenu .p-reset > li:nth-child(5)
float: right;
thisd style angular 无法识别,我不明白为什么。
如何使用 Flex 将 Tab 3 设置在右侧?或者可能具有 TabMenu 的某些属性?
【问题讨论】:
试试:host >>> .p-tabmenu .p-reset > li:nth-child(5)
>>>是什么意思?
在搜索>>>
的定义时(它只是::ng-deep
的别名。),我遇到了这个博客blog.angular-university.io/angular-host-context 说它很快就会被弃用,所以我收回我之前的评论。
非常感谢
【参考方案1】:
我在 CSS 中找到的一个解决方案是:
.p-tabmenu .p-reset
position: relative;
.p-tabmenu .p-reset > li:nth-child(5)
position: absolute;
right: 0;
top: 0;
这行得通。
【讨论】:
以上是关于PrimeNg TabMenu Angular 11:在右侧设置最后一个选项卡的主要内容,如果未能解决你的问题,请参考以下文章