スタイルシートの“background属性”について

質問

スタイルシートについて勉強しています。
　スタイルシートの本のなかに、background属性について、以下のような記述がありました。

「background:peachpuff 100% 0px;」
このような記述は、初めて見ました。

　最初、わたしは背景のいろがpeachpuff、％はいろの濃さを表わしていると思っていました。
　つまり、％の値を低くしていくと、いろが薄くなり、％の値を高くしていくと、いろが濃くなるのかな――という推測をしていました。。

　0pxについても、ボーダーの太さを表わしているのかな――と考えていました。

　そこで、試しに％の値とpxの値を変えてみました。しかし、なにも変化が現れません。
　いろいろと試した結果、「background:peachpuff 100% 0px;」は「background:peachpuff;」と書いてもおなじということでした。

「background:peachpuff 100% 0px;」と書かれている意図について、わかるかたいらっしゃいましたら、ご教授おねがいできたらと思います。

どうかよろしくお願いします。

回答No.1

marie_blue · ベストアンサー

background:peachpuff 100% 0px;

この場合、peachpuffは色、100%と0pxは位置です。
background-color:peachpuff;
と
background-position:100% 0px;
をまとめて書いているのです。
私なら単位はそろえますけれど…(100% 100%やleft topのように)

positionについては参考ＵＲＬをご覧下さい。

参考URL：

http://www.htmq.com/style/background-position.shtml

お礼

marie_blueさんへ

　迅速な回答、ほんとうにありがとうございました。たいへんわかりやすかったです。そして、わたしの予想していたことが全くの的はずれで、すこし恥ずかしかったです。
　marie_blueさんのおかげで、“background属性”について、より理解が深まりました。

　また、なにか困ったことがでてきたときは、よろしくおねがいいたします。