--- title: "スタイリング要素" slug: "styling-components" abstract: "コンポーネントや要素は、スタイルライブラリのテーマやルールを使ってコンポーネントビルダー内でスタイリングやカスタマイズが可能です。" --- # スタイリング要素 コンポーネントビルダーは、コンポーネント内の要素 [を追加](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/prototyping-components/use-elements-to-build-components.html "Use elements to build components") ・ [設定](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/prototyping-components/configuring-an-element.html "Configuring an element") することでコンポーネントを設計できます。右側パネルの設定を使って、配置、アライメント、サイズ、配置を調整できます。 また、スタイルライブラリを使ってコンポーネントや要素のスタイルも設定できます。このライブラリは**Styles** builderで構築されており、デザイナーが要素スタイルやテーマを作成・保存しています。これらのスタイルのいくつかは特定の要素カテゴリやテーマに割り当てられています。これらは要素やテーマで *許可* されているスタイルです。ライブラリに保存されているが他の要素やテーマに割り当てられたスタイルは *「利用可能な* スタイル」と呼ばれます。 スタイルのスタイリングやカスタマイズには、以下のオプションがあります: - [コンポーネントをスタイリングする](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/styling-components/style-a-component-with-a-theme.html#UUID-d70ed9ca-1316-3d5b-da01-20189b95b22b_section-idm4589729568736033556843821317 "Pick a theme for the component") - テーマの一つでクリック一つで *コンポーネント全体* をスタイリングできます。 - [テーマをカスタマイズ](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/styling-components/style-a-component-with-a-theme.html#UUID-d70ed9ca-1316-3d5b-da01-20189b95b22b_section-idm4585461261646433556844348966 "Customize a theme") する - *特定のタイプのすべての要素* (例えば、すべてのカードやすべてのイメージブロック)のスタイルを、デフォルトのスタイル以外の許容スタイルや利用可能な任意のスタイルで変更することで、コンポーネントのテーマをカスタマイズできます。 - [要素のスタイル](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/styling-components/style-a-single-element-and-text.html "Style a single element and text") - コンポーネント内の *特定の要素* を、その要素に許可されたスタイルでスタイルを付けます。 - [要素のカスタマイズ](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/styling-components/customize-an-element.html "Customize an element") - 特定の *要素* を、当初割り当てされていなかったスタイルライブラリから使える別のスタイルで、その特徴を1つ以上カスタマイズします。 - [ワンオフのカスタマイズを可能にしてください。コンポーネントビルダーで、通常はスタイルビルダーでしか使えない設定をアクセスして、](https://doc.sitecore.com/sai/ja/users/sitecoreai/design-components/components/styling-components/customize-an-element.html "Customize an element")*特定の要素をさらにカスタマイズできます。コンポーネントビルダーでのこの一度限りのカスタマイズは、スタイリングする要素にのみ影響し、他の場所で再利用することはできません。*