【CSS】background-colorとbackgroundの違い

ふと、CSSのbackground-colorとbackgroundの違いって何だろう？って思いました。

いつもは背景色を指定する場合は、

SyntaxHighlighterについて

<style>
#TableA {
  background-color: #FF8888;
}
</style>

のようにbackground-colorを使用しています。

しかし度々、以下のように書かれたものも見ます。

SyntaxHighlighterについて

<style>
#TableA {    
     background: #FF8888;  
}
</style>

どちらも同じ結果になるとは言え、どう違うんだろうと思っていました。
もともと見た目のデザインに興味が無かったことが、今まではっきり知らなかった原因なのですが。。。

background-colorとbackgroundの違いを言うと、個別に設定するか、まとめて設定するかの違いでした。

背景の指定には次の指定ができます。

背景色を指定する	background: ***;
背景の画像を指定する	background-image: url(***);
背景画像の並び方を指定する	background-repeat: ***;
背景画像の表示位置を指定する	background-position: ***;
背景画像のスクロールについて指定する	background-attachment: ***;

個別に指定する際は、上述のプロパティを使います。

逆に一括で指定したい場合は、backgroundプロパティを使います。
backgroundは、背景色や背景画像（並び方、スクロール、位置）を一括で指定するプロパティです。
このbackgroundプロパティを要素に対して設定すると、文書全体の背景をひとまとめに指定することができます。
具体的には、要素ID：TableAに対し、背景色（白）/背景画像（***.gif）/並び方（垂直方向）/表示位置（右上）/固定表示（固定する）

SyntaxHighlighterについて

#TableA{
 background: #ffffff url(***.gif) repeat-y right top fixed;
}

このように一括して設定できます。

注意点としては、backgroundプロパティに指定していないプロパティは、デフォルトで設定されます。
例えば、

SyntaxHighlighterについて

としてしまった場合、背景画像（***.gif）は指定されなかったとみなされます。
要は真っ白背景が表示されるだけです。

ちょっと気になったので、システム備忘録として載せておきます。