Blazor コントロール
Expanderのスタイル設定
コントロール > レイアウトコントロール > Expander > Expanderのスタイル設定

Expander provides various options to style its UI and elements. It allows you to use different styling properties available in the C1Expander class which allows you to easily style various visual aspects of the control. The following table lists all the styling properties available in the C1Expander class:

Properties Description
Style Changes the style of Expander
HeaderStyle Changes the style of the expander header

Blazor Expander control with styles set on header and expand icon

The following code demonstrates the use of the available styling properties in the C1Expander class to change the appearance of the Expander control:

Index.razor
コードのコピー
<C1Expander Header="@("Click")" HeaderStyle="@("background-color: BurlyWood; color:#fff1e6; font-family:cursive;font-size:22px")" 
            Style="@("overflow:hidden;background-color:Beige;width:8%;box-shadow:0px 5px 5px rgba(0,0,0,0.2)")">
            <img src="/Image/c1icon.png" />
</C1Expander>