latest
latest
ソフトウェアキーボードコントロールのCSS
本製品のソフトウェアキーボードコントロールに適用できるCSSの一覧をこちらに記載します。
これらのCSSは以下のコントロールに適用されます。
- ソフトウェアキーボードコントロール（GcSoftkeyboard）
コントロール全体
| CSSクラス | 適用箇所 | CSSプロパティ |
|---|---|---|
| .gcim__soft-keyboard （コントロールの基本スタイル） |
境界線 | border, border-color,border-radiusなど |
| 行の高さ | ling-height | |
| 背景 | background | |
| カーソルの形状 | cursor | |
| サイズ | width, height | |
| .gcim__soft-keyboard .soft-keyboard_container （コントロール内部のコンテナスタイル） |
境界線 | border, border-color, border-radiusなど |
| 余白 | padding | |
| 背景 | background | |
| .gcim__soft-keyboard .soft-keyboard_btn_panel （ボタン配置されているパネル） |
境界線 | border, border-color, border-radiusなど |
| 余白 | padding | |
| 背景 | background | |
| .gcim__soft-keyboard .soft-keyboard_title （タイトル文字部分） |
境界線 | border, border-color, border-radiusなど |
| フォント | font-family, font-sizeなど | |
| 文字色 | color | |
| 背景 | background | |
| .gcim__soft-keyboard .soft-keyboard_security-option （チェックボックス表示部の全体部分） |
境界線 | border, border-color, border-radiusなど |
| 余白 | padding, margin | |
| フォント | font-family, font-sizeなど | |
| 文字色 | color | |
| 背景 | background | |
| .gcim__soft-keyboard .soft-keyboard-labels （チェックボックス表示部のテキスト部分） |
境界線 | border, border-color, border-radiusなど |
| 余白 | padding, margin | |
| フォント | font-family, font-sizeなど | |
| 文字色 | color | |
| 背景 | background | |
| .gcim__soft-keyboard .soft-keyboard_content （各キー部分のコンテナ） .gcim__soft-keyboard .soft-keyboard_content.numeric （数値キー部分のコンテナ） .gcim__soft-keyboard .soft-keyboard_content.alphabet （アルファベットキー部分のコンテナ） .gcim__soft-keyboard .soft-keyboard_content.symbol （記号キー部分のコンテナ） .gcim__soft-keyboard .soft-keyboard_content.function （ナビゲーションキー部分のコンテナ） .gcim__soft-keyboard .soft-keyboard_content.qwerty_alphabet （qwerty配列キー部分のコンテナ） |
境界線 | border, border-color, border-radiusなど |
| 余白 | padding, margin | |
| 背景 | background |
ソフトウェアキーボタン
| CSSクラス | 適用箇所 | CSSプロパティ |
|---|---|---|
| .gcim__soft-keyboard .soft-keyboard_btn （キーのスタイル） .gcim__soft-keyboard .soft-keyboard_btn:hover （ホバー時のキーのスタイル） .gcim__soft-keyboard .soft-keyboard_btn:active （アクティブなキーのスタイル） .gcim__soft-keyboard .soft-keyboard_btn[toggled] （トグル状態のキーのスタイル） .gcim__soft-keyboard .soft-keyboard_btn[disabled] （無効なキーのスタイル） |
境界線 | border, border-color, border-radiusなど |
| フォント | font-family, font-sizeなど | |
| 文字色、背景色 | color, background-color | |
| 余白 | margin, padding | |
| 配置 | align-items, justify-content | |
| 行の高さ | line-height | |
| サイズ | width, height, min-width, min-height | |
| .gcim__soft-keyboard .soft-keyboard_btn.close_button_container （閉じるボタンのスタイル） |
境界線 | border, border-color, border-radiusなど |
| フォント | font-family, font-sizeなど | |
| 文字色、背景色 | color, background-color | |
| 余白 | margin | |
| サイズ | width, height, min-width, min-height | |
| カーソルの形状 | cursor | |
| .gcim__soft-keyboard .soft-keyboard_btn[data-key-value="Caps"] （Capsキーのスタイル） .gcim__soft-keyboard .soft-keyboard_btn[data-key-value="Shift"] （Shiftキーのスタイル） |
境界線 | border, border-color, border-radiusなど |
| フォント | font-family, font-sizeなど | |
| 文字色、背景色 | color, background-color | |
| 余白 | margin | |
| サイズ | width, height, min-width, min-height |