現在的做法：引入了新的section標簽，包裹cx-icon和h3：

<cx-icon[cxPopover]="listHint"[cxPopoverOptions]="{placement: 'auto',class: 'my-company-popover',appendToBody: true,displayCloseButton: false}"[type]="iconTypes.INFO"></cx-icon>

然后給這個section添加樣式：

這個section確實需要嗎？

section {display: flex;cx-icon {align-self: flex-start;margin-top: 4px;color: var(--cx-color, var(--cx-color-info));margin-inline-end: 1rem;}}

try avoid of unnecesary html layers (breaking changes) (is section required?)

原始的設計：

在detail header和detail children header，修改card可以同時覆蓋這兩處UI：

div class=title只影響這一小塊區域：

更多Jerry的原創文章，盡在：“汪子熙”:

總結

以上是生活随笔為你收集整理的SAP Spartacus B2B 页面 info icon 设计 - 版本1.0的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。