リストの一部としてページに多くのリンクがあります。
メディア クエリに基づいて、異なる背景位置で各リンクのスタイルを設定したいと考えています。
これまでに得たもの
a.firstLink
{
@media (min-width: 768px) and (max-width: 979px)
{
background-position:0px 0px;
}
}
a.secondLink
{
@media (min-width: 768px) and (max-width: 979px)
{
background-position:0px -100px;
}
}
これは問題なく動作しますが、リンクと同じ数のメディア クエリを実行する必要があり、リンクがたくさんあります。これに、リンクごとに実行したいメディアクエリの量 (3) を掛けると、醜い CSS になります。