::after使って、ブロック要素を重ねたいです。
コードは下記になります。
html
1<div class="sample1"> 2sample 3</div>
css
1.sample1{ 2 width: 300px; 3 height: 300px; 4 background-color: rgb(30, 133, 129); 5 position: relative; 6} 7 8.sample1::after{ 9 width: 200px; 10 height: 200px; 11 background: url("../img/design/thumb_bg.png") no-repeat; 12 content: ""; 13 position: absolute; 14 top:0; 15 left:0; 16}
上記の通り.sample1の上に.sample1::afterを重ねる形にしたいのですが、
.sample1::afterにcontent: ""; を記述しないと背景画像が現れません。
(高さ、幅、背景画像だけだと、スペースが表示されない)
content: "";は必須なのでしょうか??
宜しくお願いします。
contentには画像をurl()で指定できるのですが、そうしたくない理由は何でしょうか?
回答1件
あなたの回答
tips
プレビュー