スタイルの設定項目について

スタイルで扱う設定内容は、各コンポーネントのプロパティのうちStyleカテゴリに属する設定項目を指します。スタイルとして定義するプロパティ項目はコンポーネントの種類ごとに異なります。

スタイル設定項目一覧

nexacro platformのスタイル設定項目は下記のとおりです。シンタックスの詳細はヘルプの各項目のページをご参照ください。

文字色・背景

background

背景色、および背景となる画像を設定します。

color

textの文字色を設定します。

フォント・テキスト

font

textのフォント（文字種、ポイント数、オプション）を設定します。

letter-spacing

textの文字の間隔を設定します。

-nexa-text-align

コンポーネント内部におけるtextの表示位置の基準を設定します。水平方向に３つ（left、center、right）の中から選択します。

-nexa-text-decoration

textに傍線を設定します。傍線の有無と種類を４つ（none、underline、overline、line-through）の中から選択します。

-nexa-vertical-align

コンポーネント内部におけるtextの表示位置の基準を設定します。垂直方向に３つ（top、middle、bottom）の中から選択します。

-nexa-word-wrap

テキスト表示領域内に収まりきらない単語に対して、途中で改行するかどうかを設定します。改行有無と改行単位を３つ（none、char、english）の中から選択します。

word-spacing

textの単語の間隔を設定します。

マージン・パディング

-nexa-padding

コンポーネント領域と内部のテキスト領域間の余白を設定します。

-nexa-text-padding

コンポーネント内部に表示されるアイコンとテキスト領域の間隔を設定します。

ボーダー

border-radius

コンポーネントの四隅に丸みを付けるための設定です。丸みは各角単位で設定することができます。

-nexa-border

コンポーネントを囲う枠線の種類、色、幅を設定します。枠線はコンポーネントの内側に生成されるため、線の幅が太くなるとテキストの表示領域が小さくなります。

その他の見た目

box-shadow

コンポーネントに１つもしくは複数の影を設定します。

cursor

コンポーネント上にマウスカーソルがあるときの形状を設定します。

-nexa-edge

コンポーネントのボーダーとして画像を使用する場合、内側に表示する画像を設定します。

-nexa-icon

textと一緒に表示するアイコン画像のURLを設定します。画像の表示位置は-nexa-icon-positionプロパティで設定します。

-nexa-icon-position

-nexa-iconプロパティ値として指定した画像の表示位置を、テキスト位置を基準として４つ（left、top、right、bottom）の中から選択します。

opacity

コンポーネント領域の透明度を設定します。0.0～1.0の間の値を指定できます。