多くの CSS スタイル プロパティの名前にはハイフンが含まれており、JavaScript ではマイナス記号として解釈されます。
したがって、CSS2Properties オブジェクトのプロパティ名は、実際の CSS プロパティ名とは多少異なります。
CSS プロパティ名に 1 つ以上のハイフンが含まれている場合、JS でハイフンを削除する必要があり、ハイフンの直後の元の文字が大文字に変更されます。
float は JS のキーワードであるため、JS では float は cssFloat または floatStyle として記述されることに注意してください。
以下は、CSS プロパティと JavaScript の CSS エンコーディングの比較表です。
ボックスのラベルと属性の比較:
コード
CSS 構文 (大文字と小文字を区別しない) JavaScript 構文 (大文字と小文字を区別する)
境界線
ボーダー下ボーダー下
border-bottom-color borderBottomColor
ボーダーボトムスタイル borderBottomStyle
ボーダー下幅borderBottomWidth
ボーダーカラー borderColor
ボーダー左ボーダー左
ボーダー左の色ボーダー左の色
ボーダー左スタイル borderLeftStyle
ボーダー左幅ボーダー左幅
ボーダー右ボーダー右
border-right-color borderRightColor
ボーダーライトスタイル borderRightStyle
ボーダー右幅 borderRightWidth
ボーダースタイル
ボーダートップ
ボーダートップカラー borderTopColor
ボーダートップスタイル borderTopStyle
ボーダー上部の幅 borderTopWidth
ボーダー幅 borderWidth
クリアクリア
float floatStyle(ie) cssFloat(FF)
マージンマージン
マージン-下マージン下
マージン左 marginLeft
マージン右マージン右
マージントップ marginTop
パディング パディング
パディングボトム パディングボトム
パディング左paddingLeft
パディング右paddingRight
パディングトップ
色と背景のラベルと属性の比較:
コード
CSS 構文 (大文字と小文字を区別しない) JavaScript 構文 (大文字と小文字を区別する)
背景 背景
背景-添付ファイルbackgroundAttachment
背景色backgroundColor
背景画像背景画像
背景位置backgroundPosition
背景-繰り返し背景繰り返し
色 色
スタイルタグと属性の比較:
コード
CSS 構文 (大文字と小文字を区別しない) JavaScript 構文 (大文字と小文字を区別する)
ディスプレイディスプレイ
リストスタイルタイプ listStyleType
リストスタイルイメージ listStyleImage
リストスタイル位置 listStylePosition
リストスタイル listStyle
ホワイトスペース ホワイトスペース
テキスト スタイル ラベルと属性の比較:
コード
CSS 構文 (大文字と小文字を区別しない) JavaScript 構文 (大文字と小文字を区別する)
フォント フォント
フォントファミリー fontFamily
フォントサイズ fontSize
フォントスタイル fontStyle
フォントバリアント fontVariant
フォントの太さ fontWeight
テキストラベルと属性の比較:
コード
CSS 構文 (大文字と小文字を区別しない) JavaScript 構文 (大文字と小文字を区別する)
文字間隔letterSpacing
改行 lineBreak
行の高さ lineHeight
テキスト整列 textAlign
テキスト装飾 textDecoration
テキストインデント textIndent
text-justify textJustify
テキスト変換 textTransform
垂直整列垂直整列