CSS と JS は密接に連携して、多くのユニークな効果をページに追加します。 52CSS.com にも関連する事例があります。特別な効果を実現するには、JavaScript を使用して特定のタグの CSS プロパティを動的に変更する必要があります。たとえば、マウスが画像の上を通過すると、画像に境界線が追加されます。コードは次のようになります。JavaScript の style の後の属性は何ですか?
JavaScript CSS スタイル属性比較表
ボックスのラベルと属性の比較
CSS 構文 (大文字と小文字は区別されません) JavaScript構文 (大文字と小文字が区別されます)
境界線
ボーダー下ボーダー下
border-bottom-color borderBottomColor
ボーダーボトムスタイル borderBottomStyle
ボーダー下幅borderBottomWidth
ボーダーカラー borderColor
ボーダー左ボーダー左
ボーダー左の色ボーダー左の色
ボーダー左スタイル borderLeftStyle
ボーダー左幅ボーダー左幅
ボーダー右ボーダー右
border-right-color borderRightColor
ボーダーライトスタイル borderRightStyle
ボーダー右幅 borderRightWidth
ボーダースタイル
ボーダートップ
ボーダートップカラー borderTopColor
ボーダートップスタイル borderTopStyle
ボーダー上部の幅 borderTopWidth
ボーダー幅 borderWidth
クリアクリア
フロート floatStyle
マージンマージン
マージン-下マージン下
マージン左 marginLeft
マージン右マージン右
マージントップ marginTop
パディング パディング
パディングボトム パディングボトム
パディング左paddingLeft
パディング右paddingRight
padding-top paddingTop の
色と背景のタグと属性を
CSS 構文 (大文字と小文字を区別しない) と比較する JavaScript 構文 (大文字と小文字を区別する)
背景 背景
背景-添付ファイルbackgroundAttachment
背景色backgroundColor
背景画像背景画像
背景位置backgroundPosition
背景-繰り返し背景繰り返し
色 色
スタイルのタグと属性は、
CSS 構文 (大文字と小文字を区別しない) JavaScript 構文 (大文字と小文字を区別する)
と比較します。
ディスプレイディスプレイ
リストスタイルタイプ listStyleType
リストスタイルイメージ listStyleImage
リストスタイル位置 listStylePosition
リストスタイル listStyle
ホワイトスペース ホワイトスペース
テキスト スタイルのタグと属性と
CSS 構文 (大文字と小文字を区別しない) との比較 JavaScript 構文 (大文字と小文字を区別する)
フォント フォント
フォントファミリー fontFamily
フォントサイズ fontSize
フォントスタイル fontStyle
フォントバリアント fontVariant
font-weight fontWeight
テキスト タグと属性を
CSS 構文 (大文字と小文字を区別しない) と比較する JavaScript 構文 (大文字と小文字を区別する)
文字間隔letterSpacing
改行 lineBreak
行の高さ lineHeight
テキスト整列 textAlign
テキスト装飾 textDecoration
テキストインデント textIndent
text-justify textJustify
テキスト変換 textTransform
垂直整列垂直整列