【CSS】backgroundを一行のショートハンドで設定するコツ。background-sizeが肝！

hoge

一行だとメンテナンスが楽。

そう思って、backgroundをショートハンドにしたら、動かない！

キモは、background-size。

	background-image:url("aaa.png");
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center center;

	↓ これをショートハンドにする。

	/* NG */
	background:url("aaa.png") center center contain no-repeat;

	/* OK */
	background:url("aaa.png") center center /contain no-repeat;

background-sizeは、background-positionの指定の後に、「/」で区切って指定しなければならないとのこと。でした。

MDN web docs | background