Skip to main content

 

 

 

 
Language:

 

 
従来のWebアプリにのみ適用されます

 

 
 
OutSystems

Stacked Icon UIパターンのリファレンス

レイアウトおよびクラス

CSSセレクタ

要素 CSSクラス 説明
.stacked-icon .fa-2x アイコンのサイズを2emに変更します
.stacked-icon .fa-3x アイコンのサイズを3emに変更します
.stacked-icon .fa-4x アイコンのサイズを4emに変更します
.stacked-icon .fa-5x アイコンのサイズを5emに変更します
.stacked-icon .fa-lg アイコンのサイズを1.33333333emに変更します

高度なユースケース

ツールチップ付きのStacked Iconパターンを使用する

1.Tooltipパターンをページにドラッグします。

1.Tooltipの動作のパラメータを設定します。

![](<images/stackedicon-4-ss.png>)

1.[Widget]プレースホルダに、StackedIconパターンをドラッグします。

1.SatckedIconパターンのパラメータを設定します。

![](<images/stackedicon-5-ss.png>)

1.[Content]プレースホルダで、Tooltipパターンから希望するアイコンのラベルを設定します。

![](<images/stackedicon-6-ss.png>)

1.パブリッシュしてテストします。

注記

InvertSizeパラメータは、前後のアイコンのサイズを相互に変更します。つまり、.fa-stack-1x CSSクラスと.fa-stack-2x CSSクラスを切り替えます。

  • Was this article helpful?